<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
   <head>
       <title>OSS图片服务4.0</title>
       <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
       <link rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all.css">
       <link id="theme" rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all-gray.css" />
       <link id="theme" rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all-neptune.css" />
       <script type="text/javascript" src="./ext/ext-all.js"></script>
       <script type="text/javascript" src="./ext/help.js"></script>
       <script type="text/javascript" src="./crypto1/crypto/crypto.js"></script>
       <script type="text/javascript" src="./crypto1/hmac/hmac.js"></script>
       <script type="text/javascript" src="./crypto1/sha1/sha1.js"></script>
       <script type="text/javascript">
       Ext.BLANK_IMAGE_URL = './ext/resources/themes/images/default/tree/s.gif';
       </script>

       <script type="text/javascript">
        g_access_id = ''
        g_access_key = ''
        g_bucket = ''
        g_access_id = ''
        g_access_key = ''
        g_bucket = ''
        g_cname = ''
        g_region = ''
        g_cname = ''
        g_update_url = ''

        //var routerApp = angular.module('routerApp', [])
        Ext.QuickTips.init();
       var help_str = g_help_str
       var read_str = g_read_str
       var version = '4.0'
       var Base64 = {
    // private property
    _keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
    // public method for encoding
    encode : function (input) {
        var output = "";
        var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
        var i = 0;
        input = Base64._utf8_encode(input);
        while (i < input.length) {
            chr1 = input.charCodeAt(i++);
            chr2 = input.charCodeAt(i++);
            chr3 = input.charCodeAt(i++);
            enc1 = chr1 >> 2;
            enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
            enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
            enc4 = chr3 & 63;
            if (isNaN(chr2)) {
                enc3 = enc4 = 64;
            } else if (isNaN(chr3)) {
                enc4 = 64;
            }
            output = output +
            this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
            this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
        }
        return output;
    },
    // public method for decoding
    decode : function (input) {
        var output = "";
        var chr1, chr2, chr3;
        var enc1, enc2, enc3, enc4;
        var i = 0;
        input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
        while (i < input.length) {
            enc1 = this._keyStr.indexOf(input.charAt(i++));
            enc2 = this._keyStr.indexOf(input.charAt(i++));
            enc3 = this._keyStr.indexOf(input.charAt(i++));
            enc4 = this._keyStr.indexOf(input.charAt(i++));
            chr1 = (enc1 << 2) | (enc2 >> 4);
            chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
            chr3 = ((enc3 & 3) << 6) | enc4;
            output = output + String.fromCharCode(chr1);
            if (enc3 != 64) {
                output = output + String.fromCharCode(chr2);
            }
            if (enc4 != 64) {
                output = output + String.fromCharCode(chr3);
            }
        }
        output = Base64._utf8_decode(output);
        return output;
    },
    // private method for UTF-8 encoding
    _utf8_encode : function (string) {
        string = string.replace(/\r\n/g,"\n");
        var utftext = "";
        for (var n = 0; n < string.length; n++) {
            var c = string.charCodeAt(n);
            if (c < 128) {
                utftext += String.fromCharCode(c);
            }
            else if((c > 127) && (c < 2048)) {
                utftext += String.fromCharCode((c >> 6) | 192);
                utftext += String.fromCharCode((c & 63) | 128);
            }
            else {
                utftext += String.fromCharCode((c >> 12) | 224);
                utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                utftext += String.fromCharCode((c & 63) | 128);
            }
        }
        return utftext;
    },
    // private method for UTF-8 decoding
    _utf8_decode : function (utftext) {
        var string = "";
        var i = 0;
        var c = c1 = c2 = 0;
        while ( i < utftext.length ) {
            c = utftext.charCodeAt(i);
            if (c < 128) {
                string += String.fromCharCode(c);
                i++;
            }
            else if((c > 191) && (c < 224)) {
                c2 = utftext.charCodeAt(i+1);
                string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                i += 2;
            }
            else {
                c2 = utftext.charCodeAt(i+1);
                c3 = utftext.charCodeAt(i+2);
                string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                i += 3;
            }
        }
        return string;
    }
}
    
    function  put_style_show_result(btn,text)
    {
        if (btn == 'ok')
        {
            style_name = text;
            if (typeof(style_name) == 'undefined' || style_name== null || trim(style_name) == '')
            {
                var error_msg = "请输入样式名字！"
                MyAlert(error_msg)
                return ;
            }
            var url = get_result_url()
            if (url == -1)
            {
               return;
            }
            //MyAlert(url)
            put_style(style_name, url)
        }
    }

    /*
    var myData = [
        ['3m Co',71.72,0.02,0.03,'9/1 12:00am'],
        ['Alcoa Inc',29.01,0.42,1.47,'9/1 12:00am'],
        ['Altria Group Inc',83.81,0.28,0.34,'9/1 12:00am'],
        ['American Express Company',52.55,0.01,0.02,'9/1 12:00am'],
        ['American International Group, Inc.',64.13,0.31,0.49,'9/1 12:00am'],
        ['AT&T Inc.',31.61,-0.48,-1.54,'9/1 12:00am'],
        ['Boeing Co.',75.43,0.53,0.71,'9/1 12:00am'],
        ['Caterpillar Inc.',67.27,0.92,1.39,'9/1 12:00am'],
        ['Citigroup, Inc.',49.37,0.02,0.04,'9/1 12:00am'],
        ['E.I. du Pont de Nemours and Company',40.48,0.51,1.28,'9/1 12:00am'],
        ['Exxon Mobil Corp',68.1,-0.43,-0.64,'9/1 12:00am'],
        ['General Electric Company',34.14,-0.08,-0.23,'9/1 12:00am'],
        ['General Motors Corporation',30.27,1.09,3.74,'9/1 12:00am'],
        ['Hewlett-Packard Co.',36.53,-0.03,-0.08,'9/1 12:00am'],
        ['Honeywell Intl Inc',38.77,0.05,0.13,'9/1 12:00am'],
        ['Intel Corporation',19.88,0.31,1.58,'9/1 12:00am'],
        ['International Business Machines',81.41,0.44,0.54,'9/1 12:00am'],
        ['Johnson & Johnson',64.72,0.06,0.09,'9/1 12:00am'],
        ['JP Morgan & Chase & Co',45.73,0.07,0.15,'9/1 12:00am'],
        ['McDonald\'s Corporation',36.76,0.86,2.40,'9/1 12:00am'],
        ['Merck & Co., Inc.',40.96,0.41,1.01,'9/1 12:00am'],
        ['Microsoft Corporation',25.84,0.14,0.54,'9/1 12:00am'],
        ['Pfizer Inc',27.96,0.4,1.45,'9/1 12:00am'],
        ['The Coca-Cola Company',45.07,0.26,0.58,'9/1 12:00am'],
        ['The Home Depot, Inc.',34.64,0.35,1.02,'9/1 12:00am'],
        ['The Procter & Gamble Company',61.91,0.01,0.02,'9/1 12:00am'],
        ['United Technologies Corporation',63.26,0.55,0.88,'9/1 12:00am'],
        ['Verizon Communications',35.57,0.39,1.11,'9/1 12:00am'],
        ['Wal-Mart Stores, Inc.',45.45,0.73,1.63,'9/1 12:00am']
    ];

    var ds = new Ext.data.Store({
        reader: new Ext.data.ArrayReader({}, [
            {name: 'company'},
            {name: 'price', type: 'float'},
            {name: 'change', type: 'float'},
            {name: 'pctChange', type: 'float'},
            {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'},
            {name: 'rating', type: 'int', convert: function(v, rec) {
                   if (rec[3] < 0) return 2;
                   if (rec[3] < 1) return 1;
                   return 0;
               }
            }
        ])
    });
    ds.loadData(myData);

    var colModel = new Ext.grid.ColumnModel([
        {id:'company',header: "Company", width: 160, sortable: true, locked:false, dataIndex: 'company'},
        {header: "Price", width: 55, sortable: true, renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
        {header: "Change", width: 55, sortable: true, renderer: change, dataIndex: 'change'},
        {header: "% Change", width: 65, sortable: true, renderer: pctChange, dataIndex: 'pctChange'},
        {header: "Last Updated", width: 80, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'},
        {header: "Rating", width: 40, sortable: true, renderer: rating, dataIndex: 'rating'}
    ]);
    */

    var cm = new Ext.grid.ColumnModel( [ {  
      header : 'id',  
      dataIndex : 'product_id'  
     }, {  
      header : 'name',  
      dataIndex : 'product_name'  
     }, {  
      header : 'price',  
      dataIndex : 'product_price'  
     } ]);  
     var data = [ [ '01', 'computer', '4800' ], [ '02', 'phone', '2100' ],  
       [ '03', 'ffff', '1800' ], [ '04', 'closes', '220' ] ];  

     var store = new Ext.data.Store( {  
      proxy : new Ext.data.MemoryProxy(data),  
      reader : new Ext.data.ArrayReader( {}, [ {  
       name : 'product_id',  
       mapping : 0  
      }, {  
       name : 'product_name',  
       mapping : 1  
      }, {  
       name : 'product_price',  
       mapping : 2  
      } ])  
     }); 
    store.load(); 
    /*
    var gridPanel = new Ext.grid.GridPanel({  
        autoHeigth : false,  
        renderTo : 'grid',  
        store : store,  
        cm : cm  
    }); 
    */

    var param_window = Ext.create('widget.window', {
           title:"参数说明", 
           renderTo:Ext.getBody(), 
           modal:true,
           resizable:false, 
           buttonAlign:"center", 
           closeAction:"hide", 
           maximizable:false, 
           closable: true, 
           //bodyStyle:"padding:0px", 
           width: 700, 
           height: 630,
           items: [
           {
                xtype: 'panel',
                frame: false,
                html: g_param_str
           }
           ]
    });
    

    var add_style_window = Ext.create('widget.window', {
           title:"样式内容管理", 
           renderTo:Ext.getBody(), 
           //frame:true, 
           //plain:true, 
           resizable:false, 
           buttonAlign:"center", 
           modal:true,
           closeAction:"hide", 
           maximizable:false, 
           closable: true, 
           //bodyStyle:"padding:0px", 
           width: 400, 
           height: 370,
           items: [
           {
                xtype: 'panel',
                frame: false,
                title: '',
                //bodyStyle:'padding:0px 0px 0',
                //width: 400,
                fieldDefaults: {
                    msgTarget: 'side',
                },
                defaultType: 'textfield',
                defaults: {
                    anchor: '40%'
                },
                items: [
                {
                    fieldLabel: '样式规范:',
                    xtype:"textarea",
                    labelWidth: 65,
                    readOnly : "true",
                    value: "1.长度为1-63个字符\n2.可以包含数字、大小写字母、下划线(_)中划线(-)以及小数点(.)\n3.如果样式自定义分隔符有下划线或者中划线(-) 样式名称最好不要包含上述两个字符，因为使用这两个字符可能会导致解析异常",
                    width: 380,
                    id : 'tf_style_standard',
                    height : 120
                },
                {
                    fieldLabel: '样式名字:',
                    labelWidth: 65,
                    width: 380, 
                    emptyText: '请输入样式名字，如:mystyle',
                    id : 'tf_add_style_name'
                },
                {
                    fieldLabel: '样式内容:',
                    labelWidth: 65,
                    xtype:"textarea",
                    emptyText: '请输入样式的内容，如:100w_100h_1e_1c.jpg',
                    width: 380,
                    height : 120,
                    id : 'tf_add_style_content'
                },
                ]
           }
           ]
           ,
           buttons: [
           {
                text: '保存修改',
                handler: function () {
                    result = add_style_action()
                    if (result == 1)
                    {
                        Ext.getCmp('tf_add_style_name').setValue('')
                        Ext.getCmp('tf_add_style_content').setValue('')
                        add_style_window.hide()
                    }
                }
           },
           {
                text: '取消修改',
                handler: function () {
                    Ext.getCmp('tf_add_style_name').setValue('')
                    Ext.getCmp('tf_add_style_content').setValue('')
                    add_style_window.hide()
                }
           }
           ]
    });
    
    
    var style_store = new Ext.data.ArrayStore({
        fields: [
           { name: 'name'},
           { name: 'content' }
        ],
        data: []
    });

    var style_window = Ext.create('widget.window', {
           title:"样式管理(这里获取的样式是通过官方API获取到的.新增,修改,删除,可以直接应用到线上)", 
           renderTo:Ext.getBody(), 
           //frame:true, 
           //plain:true, 
           resizable:false, 
           buttonAlign:"center", 
           closeAction:"hide", 
           maximizable:false, 
           closable: true, 
           //bodyStyle:"padding:0px", 
           width: 650, 
           height: 480,
           items: [
           {
                border: false,
                xtype: 'grid',
                store : style_store,
                columns: 
                [
                    {
                        xtype: 'rownumberer',
                        width: 20,
                        sortable: false
                    },
                    {
                        text: "样式名称",
                        //flex: 1,
                        width: 120,
                        sortable: true,
                        dataIndex: 'name'
                    },
                    {
                        text: "样式内容",
                        width: 400,
                        sortable: true,
                        dataIndex: 'content'
                    },
                    {
                        xtype: 'actioncolumn',
                        width: 100,
                        items: [
                        {
                            icon   : './ext/resources/application_view_list.png',
                            tooltip: '查看样式完整内容',
                            handler: function(grid, rowIndex, colIndex) {
                                var rec = style_store.getAt(rowIndex);
                                content = rec.get('content')
                                MyAlert(content) 
                            }
                       },
                       '-'
                       ,
                        {
                            icon   : './ext/resources/cog_edit.png',
                            tooltip: '修改样式',
                            handler: function(grid, rowIndex, colIndex) {
                                var rec = style_store.getAt(rowIndex);
                                content = rec.get('content')
                                name = rec.get('name')
                                Ext.getCmp('tf_style_standard').setVisible(false)
                                Ext.getCmp("tf_add_style_name").setDisabled(true)
                                Ext.getCmp("tf_add_style_name").setValue(name)
                                Ext.getCmp("tf_add_style_content").setValue(content)
                                add_style_window.width = 400
                                add_style_window.height = 235
                                add_style_window.show()
                            }
                       },
                       '-'
                       ,
                        {
                            icon   : './ext/resources/delete.gif',
                            tooltip: '删除样式',
                            handler: function(grid, rowIndex, colIndex) {
                                var rec = style_store.getAt(rowIndex);
                                name = rec.get('name')
                                Ext.MessageBox.confirm('提示', '删除样式后，会导致使用该样式的链接会失效！是否确认删除样式?', callBack); 
                                    function callBack(id) { 
                                    if (id == 'yes')
                                    {
                                        delete_style(name)
                                    }
                                } 
                            }
                       }
                      ]
                   }
                ]
           }
           ]
    });

    
    var id_key_window = Ext.create('widget.window', {
           title:"设置基本信息", 
           renderTo:Ext.getBody(), 
           //frame:true, 
           //plain:true, 
           resizable:false, 
           modal:true,
           buttonAlign:"center", 
           closeAction:"hide", 
           maximizable:false, 
           closable: true, 
           //bodyStyle:"padding:0px", 
           width: 350, 
           height: 230,
           items: [
           {
                xtype: 'panel',
                frame: false,
                title: '',
                html : '<font color="#FF0000">注意，一定要开通BucketCors功能，才能使用下面的管理接口，设置的方法，请详见[使用说明]按钮</font>',
                //bodyStyle:'padding:0px 0px 0',
                width: 350,
                fieldDefaults: {
                    msgTarget: 'side',
                    labelWidth: 100
                },
                defaultType: 'textfield',
                defaults: {
                    anchor: '40%'
                },
                items: [
                {
                    fieldLabel: 'AccessID',
                    width: 330, 
                    value: g_access_id,
                    emptyText: '请输入您的AccessId',
                    id : 'tf_set_access_id'
                },
                {
                    fieldLabel: 'AccessKey',
                    width: 330, 
                    value: g_access_key,
                    emptyText: '请输入您的AccessKey',
                    id : 'tf_set_access_key'
                },
                /*
                {
                    fieldLabel: '绑定的域名',
                    emptyText: '请输入开通图片处理的Bucket的域名',
                    width: 330, 
                    value: g_cname,
                    id : 'tf_set_cname'
                },
                */
                {
                    fieldLabel: 'Bucket名字',
                    emptyText: '请输入开通图片处理的Bucket名字',
                    width: 330, 
                    value: g_bucket,
                    id : 'tf_set_bucket'
                }
                ,
                {
                    xtype:          'combo',
                    mode:           'local',
                    id:             'cb_set_region',
                    value:          g_region,
                    width: 330, 
                    triggerAction:  'all',
                    forceSelection: true,
                    editable:       false,
                    fieldLabel:     'Bucket区域',
                    emptyText:      "请选择Bucket所在的区域",
                    displayField:   'name',
                    valueField:     'value',
                    queryMode: 'local',
                    store: Ext.create('Ext.data.Store', {
                        fields : ['name', 'value'],
                        data   : [
                            {name : '杭州外网',   value: 'img-cn-hangzhou.aliyuncs.com'},
                            {name : '青岛外网',   value: 'img-cn-qingdao.aliyuncs.com'},
                            {name : '北京外网',   value: 'img-cn-beijing.aliyuncs.com'},
                            {name : '深圳外网',   value: 'img-cn-shenzhen.aliyuncs.com'}
                        ]
                    })
                }
                ]
           }
           ]
           ,
           buttons: [
           {
                text: '保存修改',
                handler: function () {
                    result = save_id_key()
                    if (result == 1)
                    {
                        id_key_window.hide()
                    }
                }
           },
           {
                text: '取消修改',
                handler: function () {
                    id_key_window.hide()
                }
           }]
    });

    var channel_window = Ext.create('widget.window', {
           title:"频道属性", 
           renderTo:Ext.getBody(), 
           //frame:true, 
           //plain:true, 
           resizable:false, 
           buttonAlign:"center", 
           modal:true,
           closeAction:"hide", 
           maximizable:false, 
           closable: true, 
           //bodyStyle:"padding:0px", 
           width: 350, 
           //height: 370,
           height: 440,
           items: [
           {
                xtype: 'panel',
                frame: false,
                title: '',
                //bodyStyle:'padding:0px 0px 0',
                width: 400,
                fieldDefaults: {
                    msgTarget: 'side',
                    labelWidth: 100
                },
                defaultType: 'textfield',
                defaults: {
                    anchor: '40%'
                },
                items: [
                {
                    fieldLabel: '开通时间',
                    width: 320, 
                    readOnly: 'true',
                    id : 'tf_createtime'
                },
                {
                    fieldLabel: '最后修改时间',
                    width: 320, 
                    readOnly: 'true',
                    id : 'tf_lastmodify_time'
                },
                {
                    xtype:          'combo',
                    mode:           'local',
                    id:             'cb_only_use_style',
                    value:          '0',
                    width: 320, 
                    triggerAction:  'all',
                    forceSelection: true,
                    editable:       false,
                    fieldLabel:     '只允许用样式',
                    displayField:   'name',
                    valueField:     'value',
                    queryMode: 'local',
                    store: Ext.create('Ext.data.Store', {
                        fields : ['name', 'value'],
                        data   : [
                            {name : '开启',   value: '1'},
                            {name : '不限制',   value: '0'}
                        ]
                    })
                },
                {
                    xtype:          'combo',
                    mode:           'local',
                    id:             'cb_forbid_orig',
                    value:          '0',
                    width: 320, 
                    triggerAction:  'all',
                    forceSelection: true,
                    editable:       false,
                    fieldLabel:     '禁止访问原图',
                    displayField:   'name',
                    valueField:     'value',
                    queryMode: 'local',
                    store: Ext.create('Ext.data.Store', {
                        fields : ['name', 'value'],
                        data   : [
                            {name : '开启',   value: '1'},
                            {name : '不限制',   value: '0'}
                        ]
                    })
                },
                {
                    xtype:          'combo',
                    mode:           'local',
                    id:             'cb_auto_set_content_type',
                    value:          '0',
                    width: 320, 
                    triggerAction:  'all',
                    forceSelection: true,
                    editable:       false,
                    fieldLabel:     '自动设置ContentType',
                    displayField:   'name',
                    valueField:     'value',
                    queryMode: 'local',
                    store: Ext.create('Ext.data.Store', {
                        fields : ['name', 'value'],
                        data   : [
                            {name : '开启',   value: '1'},
                            {name : '不限制',   value: '0'}
                        ]
                    })
                },
                {
                    xtype:          'combo',
                    mode:           'local',
                    id:             'cb_set_attach_name',
                    value:          '0',
                    width: 320, 
                    triggerAction:  'all',
                    forceSelection: true,
                    editable:       false,
                    fieldLabel:     '自动设置下载名',
                    displayField:   'name',
                    valueField:     'value',
                    queryMode: 'local',
                    store: Ext.create('Ext.data.Store', {
                        fields : ['name', 'value'],
                        data   : [
                            {name : '开启',   value: '1'},
                            {name : '不限制',   value: '0'}
                        ]
                    })
                },
                {
                    xtype:          'combo',
                    mode:           'local',
                    id:             'cb_use_src_format',
                    value:          '0',
                    width: 320, 
                    triggerAction:  'all',
                    forceSelection: true,
                    editable:       false,
                    fieldLabel:     '不填格式，默认按原图格式',
                    displayField:   'name',
                    valueField:     'value',
                    queryMode: 'local',
                    store: Ext.create('Ext.data.Store', {
                        fields : ['name', 'value'],
                        data   : [
                            {name : '开启',   value: '1'},
                            {name : '不限制',   value: '0'}
                        ]
                    })
                },
                {
                    fieldLabel: '404缺省图片',
                    width: 320, 
                    emptyText: '当图片找不到时，默认显示的图片',
                    id : 'tf_404file'
                },
                {
                    xtype: 'checkboxgroup',
                    fieldLabel: '自定义样式分隔符',
                    width: 320, 
                    columns: 1,
                    items: [
                        {boxLabel: '-(中划线)', id: 'cb-style-'},
                        {boxLabel: "_(下划线)", id: 'cb-style_'},
                        {boxLabel: '/(斜杠)', id: 'cb-style/'},
                        {boxLabel: '!(感叹号)', id: 'cb-style!'}
                    ]
                }
               ] 
           }
           ],
           buttons: [
           {
                text:'<font color="red">参数说明</font>',
                handler: function () {
                    param_window.show()
                }
           }
           ,
           {
                text: '保存修改',
                handler: function () {
                    Ext.MessageBox.confirm('提示', '确认详细看过参数说明后，知道参数设置造成的影响，确认保存修改?', callBack); 
                        function callBack(id) { 
                        //alert('单击的按钮id是：'+id); 
                        if (id == 'yes')
                        {
                            put_channel()
                        }
                    } 
                }
           },
           {
                text: '取消修改',
                handler: function () {
                    channel_window.hide()
                }
           }]
    });

    function MyAlert(msg)
    {
        Ext.MessageBox.alert('OSS图片服务', msg);
    }
    function parse_xml(xmlString)
    {
        var xmlDoc=null;
        if(!window.DOMParser && window.ActiveXObject){   //window.DOMParser 判断是否是非ie浏览器
            var xmlDomVersions = ['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
            for(var i=0;i<xmlDomVersions.length;i++){
                try{
                    xmlDoc = new ActiveXObject(xmlDomVersions[i]);
                    xmlDoc.async = false;
                    xmlDoc.loadXML(xmlString); //loadXML方法载入xml字符串
                    break;
                }catch(e){
                }
            }
        }
        else if(window.DOMParser && document.implementation && document.implementation.createDocument){
            try{
                domParser = new  DOMParser();
                xmlDoc = domParser.parseFromString(xmlString, 'text/xml');
            }catch(e){
            }
        }
        else{
            return null;
        }

        return xmlDoc;
    }

    function get_xml_tags(xmlDoc, tag_name)
    {
       array_list = new Array()
       var result = ''
       var x = xmlDoc.getElementsByTagName(tag_name)
       for (var i = 0; i < x.length; i++)  {
           result = x[i].childNodes[0].nodeValue
           if (result.search('Time') == -1)
           {
           }
           array_list.push(result)
       }    
       return array_list
    }

    function get_xml_tag(xmlDoc, tag_name)
    {
       var result = ''
       var root = xmlDoc.documentElement;
       var markers = root.getElementsByTagName(tag_name), nameEl;
       nameEl = markers[0]
       if (nameEl.firstChild == null)
       {
            result = ''
       }
       else
       {
            result = nameEl.firstChild.data
       }
       return result
    }

    function http_request(oss_date, method, url, signature)
    {
        var responseText = null
        Ext.Ajax.request({
          url : url,
          method: method,
          headers: {
                'x-oss-date': oss_date,
                'Authorization' : signature
          },
          success: function (response,data) {
               responseText = response.responseText
          },
          failure: function (response) {
              Ext.MessageBox.alert('fail', trim(response.responseText));
          }
        }) 
        return responseText
    }

    function get_gmt_time()
    {
        return (new Date()).toGMTString()
    }

    function oss_sign(method, resource, oss_date, content_type)
    {
        content_md5 = ''
        canonicalized_oss_headers = 'x-oss-date:' + oss_date + '\n'
        string_to_sign = method + "\n" + content_md5 + "\n" + content_type + "\n" + oss_date + "\n" + canonicalized_oss_headers + resource
        //alert(string_to_sign)
        var message = string_to_sign
        var secret = g_access_key
        var bytes = Crypto.HMAC(Crypto.SHA1, message, secret, { asBytes: true }) ;
        var signature = Crypto.util.bytesToBase64(bytes);
        signature = 'OSS ' + g_access_id + ':' + signature;
        return signature
    }

    function delete_style(style_name)
    {
        oss_date = get_gmt_time()
        host = g_bucket + g_region
        method = 'DELETE'
        object_resource = '?style&styleName=' + style_name
        resource = '/' + g_bucket + object_resource 
        signature = oss_sign(method, resource, oss_date, '')
        url = 'http://' + g_region + resource
        //alert(url)
        Ext.Ajax.request({
          url : url,
          method: method,
          headers: {
                'x-oss-date': oss_date,
                'Authorization' : signature
          },
          success: function (response,data) {
                MyAlert('删除样式成功！注意，如果您正在使用CDN,样式删除后，因为缓存的原因，链接可能还能访问');
                list_style()
          },
          failure: function (response) {
              Ext.MessageBox.alert('删除样式失败', trim(response.responseText));
          }
        }) 
    }

    function get_style(bucket, style_name)
    {
        oss_date = get_gmt_time()
        host = g_bucket + g_region
        method = 'GET'
        object_resource = '/?style&styleName=' + style_name
        resource = '/' + bucket + object_resource 
        signature = oss_sign(method, resource, oss_date, '')
        url = 'http://' + host + object_resource
        Ext.Ajax.request({
          url : url,
          method: method,
          headers: {
                'x-oss-date': oss_date,
                'Authorization' : signature
          },
          success: function (response,data) {
                xmlDoc = parse_xml(response.responseText)
                if (xmlDoc == null)
                {
                    Ext.MessageBox.alert('OSS图片服务', "您的浏览器不支持xml文件读取,于是本页面禁止您的操作,推荐使用IE5.0以上可以解决此问题!");
                    return null;
                }
                alert(get_xml_tag(xmlDoc, "Name"))
                alert(get_xml_tag(xmlDoc, "Content"))
          },
          failure: function (response) {
              Ext.MessageBox.alert('fail', trim(response.responseText));
          }
        }) 
    }

    function add_style()
    {
        Ext.getCmp('tf_style_standard').setVisible(true)
        Ext.getCmp("tf_add_style_name").setDisabled(false)
        Ext.getCmp("tf_add_style_name").setValue('')
        Ext.getCmp("tf_add_style_content").setValue('')
        add_style_window.width = 400
        add_style_window.height = 370
        add_style_window.show()
    }

    function set_id_key()
    {
        id_key_window.show()
    }

    function list_style()
    {
        oss_date = get_gmt_time()
        host = g_region
        method = 'GET'
        object_resource = "?style"
        resource = '/' + g_bucket + object_resource
        content_type = '',
        signature = oss_sign(method, resource, oss_date, content_type)
        url = 'http://' + host + resource
        //alert(url)
        Ext.Ajax.request({
          url : url,
          method: method,
          headers: {
                'x-oss-date': oss_date,
                'Authorization' : signature
          },
          success: function (response,data) {
              //MyAlert(response.responseText)
              xmlDoc = parse_xml(response.responseText)
              if (xmlDoc == null)
              {
                  Ext.MessageBox.alert('OSS图片服务', "您的浏览器不支持xml文件读取,于是本页面禁止您的操作,推荐使用IE5.0以上可以解决此问题!");
                  return null;
              }
              content_list = get_xml_tags(xmlDoc, "Content")
              name_list = get_xml_tags(xmlDoc, "Name")
              //ctime_list = get_xml_tags(xmlDoc, "CreateTime")
              //mtime_list = get_xml_tags(xmlDoc, "LastModifyTime")
              if (content_list.length != name_list.length)
              {
                    MyAlert("内部错误，获取样式失败，失败原因：数据不对应！")
                    return null;
              }
              result = new Array() 
              for (var i = 0; i < name_list.length; ++i)
              {
                  tmp = Array()
                  tmp.push(name_list[i])
                  tmp.push(content_list[i])
                  result.push(tmp)
              }
              style_store.loadData(result);
              if (style_window.isVisible() == false)
              {
                  if (add_style_window.isVisible() == false)
                  {
                    style_window.show()
                  }
              }
          },
          failure: function (response) {
              msg = '保存成样式失败:' + trim(response.responseText)
              MyAlert(msg)
          }
        }) 
    }

    function save_id_key()
    {
        access_id = Ext.getCmp('tf_set_access_id').getValue()
        if (typeof(access_id) == 'undefined' || access_id == null || access_id == '')
        {
            MyAlert('AccessID不能为空！')
            return 0
        }
        access_key = Ext.getCmp('tf_set_access_key').getValue()
        if (typeof(access_key) == 'undefined' || access_key == null || access_key == '')
        {
            MyAlert('AccessKey不能为空！')
            return 0
        }
        bucket = Ext.getCmp('tf_set_bucket').getValue()
        if (typeof(bucket) == 'undefined' || bucket == null || bucket == '')
        {
            MyAlert('Bucket名字不能为空！')
            return 0
        }

        /*
        cname = Ext.getCmp('tf_set_cname').getValue()
        if (typeof(cname) == 'undefined' || cname == null || cname == '')
        {
            MyAlert('绑定的域名不能为空！')
            return 0
        }
        */

        region = Ext.getCmp('cb_set_region').getValue()
        if (typeof(region) == 'undefined' || region == null || region == '')
        {
            MyAlert('Bucket区域不能为空！')
            return 0
        }
        g_access_id = access_id
        g_access_key = access_key
        g_region = region
        //g_cname = cname
        g_bucket = bucket
        return 1;
    }

    function get_channel()
    {
        oss_date = get_gmt_time()
        host = g_region
        method = 'GET'
        resource = '/' + g_bucket + '?img'
        signature = oss_sign(method, resource, oss_date, '')
        url = 'http://' + host + resource
        //alert(url)

        Ext.Ajax.request({
          url : url,
          method: method,
          headers: {
                'x-oss-date': oss_date,
                'Authorization' : signature
          },
          success: function (response,data) {
                xmlDoc = parse_xml(response.responseText)
                if (xmlDoc == null)
                {
                    Ext.MessageBox.alert('OSS图片服务', "您的浏览器不支持xml文件读取,于是本页面禁止您的操作,推荐使用IE5.0以上可以解决此问题!");
                    return null;
                }
                
                Ext.getCmp('tf_createtime').setValue(get_xml_tag(xmlDoc, "CreateTime"))
                Ext.getCmp('tf_lastmodify_time').setValue(get_xml_tag(xmlDoc, "LastModifyTime"))
                Ext.getCmp('tf_404file').setValue(get_xml_tag(xmlDoc, "Default404Pic"))
                if (get_xml_tag(xmlDoc, "OrigPicForbidden") == 'False')
                {
                    Ext.getCmp('cb_forbid_orig').setValue('0')
                }
                else
                {
                    Ext.getCmp('cb_forbid_orig').setValue('1')
                }
                if (get_xml_tag(xmlDoc, "UseStyleOnly") == 'False')
                {
                    Ext.getCmp('cb_only_use_style').setValue('0')
                }
                else
                {
                    Ext.getCmp('cb_only_use_style').setValue('1')
                }
                if (get_xml_tag(xmlDoc, "AutoSetContentType") == 'False')
                {
                    Ext.getCmp('cb_auto_set_content_type').setValue('0')
                }
                else
                {
                    Ext.getCmp('cb_auto_set_content_type').setValue('1')
                }

                if (get_xml_tag(xmlDoc, "SetAttachName") == 'False')
                {
                    Ext.getCmp('cb_set_attach_name').setValue('0')
                }
                else
                {
                    Ext.getCmp('cb_set_attach_name').setValue('1')
                }

                if (get_xml_tag(xmlDoc, "UseSrcFormat") == 'False')
                {
                    Ext.getCmp('cb_use_src_format').setValue('0')
                }
                else
                {
                    Ext.getCmp('cb_use_src_format').setValue('1')
                }
                style_delimiter = get_xml_tag(xmlDoc, "StyleDelimiters")
                if (style_delimiter.indexOf('-') == -1)
                {
                    Ext.getCmp('cb-style-').setValue(false)
                }
                else
                {
                    Ext.getCmp('cb-style-').setValue(true)
                }

                if (style_delimiter.indexOf('_') == -1)
                {
                    Ext.getCmp('cb-style_').setValue(false)
                }
                else
                {
                    Ext.getCmp('cb-style_').setValue(true)
                }
                if (style_delimiter.indexOf('/') == -1)
                {
                    Ext.getCmp('cb-style/').setValue(false)
                }
                else
                {
                    Ext.getCmp('cb-style/').setValue(true)
                }
                if (style_delimiter.indexOf('!') == -1)
                {
                    Ext.getCmp('cb-style!').setValue(false)
                }
                else
                {
                    Ext.getCmp('cb-style!').setValue(true)
                }
                channel_window.show();
          },
          failure: function (response) {
              Ext.MessageBox.alert('fail', trim(response.responseText));
          }
        }) 
    }

    function get_checkbox_value(id)
    {
        var value = Ext.getCmp(id).getValue().toString()
        if (value == '1')
        {
            value = 'True'
        }
        else
        {
            value = 'False'
        }
        return value
    }

    function get_style_delimiter()
    {
        delimiter = ''
        var value = Ext.getCmp('cb-style-').getValue().toString()
        if (value == 'true')
        {
            if (delimiter != '')
            {
                delimiter += ','
            }
            delimiter += '-'
        }
        var value = Ext.getCmp('cb-style_').getValue().toString()
        if (value == 'true')
        {
            if (delimiter != '')
            {
                delimiter += ','
            }
            delimiter += '_'
        }
        var value = Ext.getCmp('cb-style/').getValue().toString()
        if (value == 'true')
        {
            if (delimiter != '')
            {
                delimiter += ','
            }
            delimiter += '/'
        }
        var value = Ext.getCmp('cb-style!').getValue().toString()
        if (value == 'true')
        {
            if (delimiter != '')
            {
                delimiter += ','
            }
            delimiter += '!'
        }
        return delimiter
    }
    function get_channel_xml()
    {
        body = '<Channel>'
        body += '<OrigPicForbidden>'
        body += get_checkbox_value('cb_forbid_orig')
        body += '</OrigPicForbidden>'
        body += '<UseStyleOnly>'
        body += get_checkbox_value('cb_only_use_style')
        body += '</UseStyleOnly>'
        body += '<StyleDelimiters>'
        body += get_style_delimiter()
        body += '</StyleDelimiters>'
        body += '<AutoSetContentType>'
        body += get_checkbox_value('cb_auto_set_content_type')
        body += '</AutoSetContentType>'
        body += '<UseSrcFormat>'
        body += get_checkbox_value('cb_use_src_format')
        body += '</UseSrcFormat>'
        body += '<SetAttachName>'
        body += get_checkbox_value('cb_set_attach_name')
        body += '</SetAttachName>'
        body += '<Default404Pic>'
        body += trim(Ext.getCmp('tf_404file').getValue())
        body += '</Default404Pic>'
        body += '</Channel>'
        return body
    }

    function add_style_action()
    {
        style_name = Ext.getCmp('tf_add_style_name').getValue()
        if (typeof(style_name) == 'undefined' || style_name == null || style_name == '')
        {
            MyAlert('样式名字不能为空！')
            return 0
        }

        style_content = Ext.getCmp('tf_add_style_content').getValue()
        if (typeof(style_content) == 'undefined' || style_content == null || style_content == '')
        {
            MyAlert('样式内容不能为空！')
            return 0
        }
        put_style(style_name, style_content)
        return 1
    }

    function put_style(style_name, content)
    {
        oss_date = get_gmt_time()
        host = g_bucket + g_region
        method = 'PUT'
        object_resource = "?style&styleName=" + style_name
        resource = '/' + g_bucket + object_resource
        content_type = 'text/xml',
        signature = oss_sign(method, resource, oss_date, content_type)
        //url = 'http://' + host + '/' + object_resource
        url = 'http://' + g_region + resource
        //alert(url)
        body = '<Style><Content>' + content + '</Content></Style>'
        Ext.Ajax.request({
          url : url,
          method: method,
          xmlData: body,
          headers: {
                'x-oss-date': oss_date,
                'Authorization' : signature
          },
          success: function (response,data) {
              msg = '保存<br/>样式名字:' + style_name + '<br/>样式内容:' + content + '<br/> 成功！注意，如果您使用了CDN,修改样式内容后（新增样式的，请忽略此信息），因为缓存的原因，旧的图片，显示的结果可能是老的处理结果，解决办法就是：刷新CDN缓存'
              MyAlert(msg)
              if (style_window.isVisible() == true)
              {
                list_style()
              }
          },
          failure: function (response) {
              msg = '保存成样式失败:' + trim(response.responseText)
              MyAlert(msg)
          }
        }) 
    }

    function put_channel()
    {
        oss_date = get_gmt_time()
        host = g_region
        method = 'PUT'
        resource = '/' + g_bucket + '?img'
        content_type = 'text/xml',
        signature = oss_sign(method, resource, oss_date, content_type)
        url = 'http://' + host + resource
        //alert(url)
        body = get_channel_xml()
        Ext.Ajax.request({
          url : url,
          method: method,
          xmlData: get_channel_xml(),
          headers: {
                'x-oss-date': oss_date,
                'Authorization' : signature
          },
          success: function (response,data) {
              MyAlert('设置频道属性成功')
              channel_window.hide()
          },
          failure: function (response) {
              msg = '设置频道属性失败' + trim(response.responseText)
              MyAlert(msg)
          }
        }) 
    }


    function trim(str)
    { 
        return str.replace(/(^\s*)|(\s*$)/g, "");
    }

    function check_basic_info()
    {
        if (g_access_id == '' || g_access_key == '' || g_bucket == '' || g_region == '')
        {
            MyAlert('请先点击[管理]->[ID/Key设置]，设置基本信息！')
            return 0;
        }
        return 1;
    }

    function check_update()
    {
        var xmlHttp = null;
        theUrl = 'http://imgtool.oss-cn-qingdao.aliyuncs.com/image-demo-tool-update'
        xmlHttp = new XMLHttpRequest();
        if (window.XMLHttpRequest)
        {
            xmlHttp=new XMLHttpRequest();
        }
        else if (window.ActiveXObject)
        {
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlHttp.open("GET", theUrl, false);
        xmlHttp.send( null );
        new_version = trim(xmlHttp.responseText)
        if (new_version != version)
        {
            g_update_url = 'http://imgtool.oss-cn-qingdao.aliyuncs.com/image-demo-tool.' + new_version + '.zip'
            return g_update_url
        }
        else
        {
            g_update_url = 'ok'
        }
        return ''
    }

    function urlsafe_base64_encoding(url)
    {
        tmp = Base64.encode(url)
        tmp = tmp.replace(/\+/g, '-')
        tmp = tmp.replace(/\//g, '_')
        tmp = tmp.replace(/=/g, '')
        return tmp
    }

    function no_port(ip)
    {
        host = ip.split(':')[0]
        return host
    }

    function is_IP(ip)      
    {  
        ip = no_port(ip)
        var re=/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/;//正则表达式
        if(re.test(ip))     
        {     
           if( RegExp.$1<256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256)
           return true;     
        }     
        return false;      
    }  

   var useStyle = 'false'
   var useEncode = 'false'
   var detail_type = 1

   function show_result()
   {
       var url = get_result_url()
       if (url != -1)
       {
           var host = get_host()
           if (host != 0) 
           {
               url = host + url
               var img_url = '<img src=\"' + url + '\"/>'
               Ext.getCmp('show_url').setValue(url)
               Ext.getCmp('picbox1').body.update(img_url)
           }
       }
   }

   function get_beautify_url()
   {
        url = ''
        var bright = Ext.getCmp('sl_bright').getValue()
        if (bright != 0)
        {
            url += bright + 'b'
        }
        var contrast = Ext.getCmp('sl_contrast').getValue()
        if (contrast != 0)
        {
            if (url != '')
            {
                url += '_'
            }
            url += contrast + 'd'
        }
        return url
   }

   function get_result_url()
   {
        if (check_parameter_valid() == 0)
        {
            return -1
        }

        if (Ext.getCmp("fs_process").collapsed == true /* && Ext.getCmp("fs_beautify").collapsed == true */
            && Ext.getCmp("fs_watermark").collapsed == true)
        {
            Ext.MessageBox.alert('错误', '必须选中一个处理类型!');
            return -1;
        }

        var url = '' 
        var has_pipe = false
        /*
        if (Ext.getCmp("fs_beautify").collapsed == false)
        {
            var beautify_url = get_beautify_url() 
            url += beautify_url
            has_pipe = true
        }
        */

        if (Ext.getCmp("fs_process").collapsed == false)
        {
            var process_url = get_process_url() 
            if (url != '')
            {
                url += '_'
            }
            url += process_url
            has_pipe = true
        }

        
        if (Ext.getCmp("fs_watermark").collapsed == false)
        {
            var watermark_url = get_watermark_url()
            if (has_pipe == true)
            {
                url += "|"
            }
            url += watermark_url
        }
        //alert(url)
        return url

        if (1)
        {
               check_parameter_valid()
               var result = check_parameter_valid()
               if (result == 1)
               {
                   if (wm_result != 0)
                   {
                       var host = get_host()
                       //wm_result = encodeURIComponent(wm_result)
                       wm_result = wm_result
                       return wm_result
                   }
               }
        }
        else
        {
           check_parameter_valid()
           var result = check_parameter_valid()
           if (result == 1)
           {
               var wm_result = get_watermark_url()
               if (wm_result != 0)
               {
                   var zoom_url = get_image_service_url()
                   var host = get_host()
                   //wm_result = encodeURIComponent(wm_result)
                   wm_result = wm_result
                   var url = zoom_url + '|' + wm_result
                   return url
               }
           }
        }
   }

   function get_host()
   {
        url = ''
        var bucket = Ext.getCmp("bucket").getValue()
        if (typeof(bucket) == 'undefined' || bucket == null || bucket == '')
        {
           var error_msg = '请输入图片服务绑定的域名, 如果没有域名可以点击[试用]按钮, 进行试用, <br/> 开通可以查看[帮助-我要开通]！'
           Ext.MessageBox.alert('OSS图片服务', error_msg);
           return 0
        }
        var object_name = Ext.getCmp("object").getValue()
        if (typeof(object_name) == 'undefined' || object_name == null || object_name == '')
        {
           var error_msg = "请输入Object！"
           Ext.MessageBox.alert('OSS图片服务', error_msg);
           return 0
        }
        if (Ext.getCmp("image-wm").getValue() == true || Ext.getCmp("font-image-wm").getValue() == true)
        {
            wm_object = Ext.getCmp('image_wm_url').getValue() 
            if (typeof(wm_object) == 'undefined' || wm_object == null || wm_object == '')
            {
                Ext.MessageBox.alert('错误', '请输入要水印Object！');
                return 0;
            }
        }
        if (Ext.getCmp("font-wm").getValue() == true || Ext.getCmp("font-image-wm").getValue() == true)
        {
            wm_object = Ext.getCmp('image_font_url').getValue() 
            if (typeof(wm_object) == 'undefined' || wm_object == null || wm_object == '')
            {
                Ext.MessageBox.alert('错误', '请输入文字水印内容！');
                return 0;
            }
        }
        if (bucket.indexOf('http://') == -1)
        {
            url = 'http://'
        }
        url +=  bucket + '/' + object_name + '@'
        return url
   }

   function get_font_watermark_url()
   {
        url = ''
        var font_type = Ext.getCmp('combox_fonttype').getValue()
        //url = url + '&type=' + Base64.encode(font_type)
        url = url + '&type=' + urlsafe_base64_encoding(font_type)
        var font_size = Ext.getCmp('font_size').getValue()
        url = url + '&size=' + font_size
        var font_text = Ext.getCmp('image_font_url').getValue()
        //url = url + '&text=' + Base64.encode(font_text)
        url = url + '&text=' + urlsafe_base64_encoding(font_text)
        var font_color = Ext.getCmp('font_color').getValue()
        //url = url + '&color=' + Base64.encode(font_color)
        url = url + '&color=' + urlsafe_base64_encoding(font_color)
        shadown = Ext.getCmp('cb_wm_shadown').getValue().toString()
        if (shadown == 'true')
        {
            url = url + '&s=' + Ext.getCmp('font_shadown').getValue()
        }
        return url
   }

   function get_image_watermark_url()
   {
        url = ''
        var img_wm_url = Ext.getCmp('image_wm_url').getValue()
        status = Ext.getCmp('cb_wm_process').getValue()
        if (status == 'true')
        {
            img_wm_url += '@'
            img_wm_url += Ext.getCmp('image_wm_p').getValue() 
            img_wm_url += Ext.getCmp('cb_wm_p').getValue() 
        }
        //alert(img_wm_url)
        url = url + '&object=' + urlsafe_base64_encoding(img_wm_url)
        return url
   }

   function get_watermark_url()
   {
    url = ''
    /*
    var bucket = Ext.getCmp("bucket").getValue()
    if (typeof(bucket) == 'undefined' || bucket == null || bucket == '')
    {
       var error_msg = 'Please input a bucket!'
       MyAlert(error_msg)
       //Ext.MessageBox.alert('IMG', error_msg);
       return 0
    }
    var object_name = Ext.getCmp("object").getValue()
    if (typeof(object_name) == 'undefined' || object_name == null || object_name == '')
    {
       var error_msg = "Please input a object!"
       Ext.MessageBox.alert('IMG', error_msg);
       return 0
    }
    */
    url = 'watermark='
    if (Ext.getCmp("font-wm").getValue() == true)
    {
        url += '2&'
        url += get_font_watermark_url()
        //Ext.MessageBox.alert('IMG', url);
    }
    else if (Ext.getCmp("image-wm").getValue() == true)
    {
        url += '1&'
        url += get_image_watermark_url()
    }
    else if (Ext.getCmp("font-image-wm").getValue() == true)
    {
        url += '3&'
        url += get_image_watermark_url()
        url += get_font_watermark_url()
        order = Ext.getCmp("combox_fontimg_sort").getValue()
        if (order == 'img-first')
        {
            url += "&order=0"
        }
        else
        {
            url += "&order=1"
        }
        align = Ext.getCmp('cb_wm_align').getValue()
        url += "&align=" + align
        interval = Ext.getCmp("font-img-space").getValue()
        url += "&interval=" + interval
        //Ext.MessageBox.alert('IMG', url);
    }
    var dissolve = Ext.getCmp('transparent').getValue()
    url = url + '&t=' + dissolve 
    var pos = ''
    if (Ext.getCmp("leftup").getValue() == true)
    {
        pos = '1'
    }
    else if(Ext.getCmp("leftdown").getValue() == true)
    {
        pos = '7'
    }
    else if(Ext.getCmp("left").getValue() == true)
    {
        pos = '4'
    }
    else if(Ext.getCmp("center").getValue() == true)
    {
        pos = '5'
    }
    else if(Ext.getCmp("up").getValue() == true)
    {
        pos = '2'
    }
    else if(Ext.getCmp("down").getValue() == true)
    {
        pos = '8'
    }
    else if(Ext.getCmp("right").getValue() == true)
    {
        pos = '6'
    }
    else if(Ext.getCmp("rightup").getValue() == true)
    {
        pos = '3'
    }
    else if(Ext.getCmp("rightdown").getValue() == true)
    {
        pos = '9'
    }

    url = url + '&p=' + pos
    //alert(url)
    if (Ext.getCmp('h_margins-container').isVisible())
    {
        dx = Ext.getCmp('h_margins').getValue()
        if (dx == null || parseInt(dx) < 0)
        {
           var error_msg = '请输入正确的水平边距!'
           Ext.MessageBox.alert('IMG', error_msg);
           return 0
        }
        url += '&x='
        url += dx
    }
    if (Ext.getCmp('v_margins-container').isVisible())
    {
        dy = Ext.getCmp('v_margins').getValue()
        if (dy == null || parseInt(dy) < 0)
        {
           var error_msg = '请输入正确的垂直边距!'
           Ext.MessageBox.alert('IMG', error_msg);
           return 0
        }
        url += '&y='
        url += dy
    }
    if (Ext.getCmp('fc_wm_offset').isVisible())
    {
        num = Ext.getCmp('h_wm_offset').getValue()
        if (num == null || parseInt(num) < -1000 || parseInt(num) > 1000)
        {
           var error_msg = '请输入正确的垂直中线偏移量!'
           Ext.MessageBox.alert('IMG', error_msg);
           return 0
        }
        url += '&voffset='
        url += num
    }
    return url
   }

   function check_parameter_valid()
   {
       var result = ""
       if (Ext.getCmp("font-wm").getValue() == true || Ext.getCmp("font-image-wm").getValue() == true)
       {
           var object_name = Ext.getCmp("image_font_url").getValue()
           if (typeof(object_name) == 'undefined' || object_name == null || object_name == '')
           {
               MyAlert("请输入文字水印内容")
               return 0
           }
       }
       if (Ext.getCmp("image-wm").getValue() == true || Ext.getCmp("font-image-wm").getValue() == true)
       {
           var object_name = Ext.getCmp("image_wm_url").getValue()
           if (typeof(object_name) == 'undefined' || object_name == null || object_name == '')
           {
               MyAlert("请输入水印object")
               return 0
           }
       }

       var width = Ext.getCmp('width').getValue()
       //if (typeof(width) == 'undefined' || width == null || width == '')
       if (width == null)
       {
           var error_msg = "Please input width length!"
           Ext.MessageBox.alert('IMG', error_msg);
           return 0
       }
       var height = Ext.getCmp('height').getValue()
       if (height == null)
       {
           var error_msg = "Please input height length!"
           Ext.MessageBox.alert('IMG', error_msg);
           return 0
       }
       var format = Ext.getCmp('format').getValue()
       var quality = Ext.getCmp('quality').getValue()
       return 1
 }

    function get_service_url()
    {
        var bucket = Ext.getCmp("bucket").getValue()
        var object_name = Ext.getCmp("object").getValue()
        if (bucket.indexOf('http://') == -1)
        {
            url = 'http://'
        }
        if (typeof(bucket) == 'undefined' || bucket == null || bucket == '')
        {
           var error_msg = '请输入图片服务绑定的域名, 如果没有域名可以点击[试用]按钮, 进行试用, <br/> 开通可以查看[帮助-我要开通]！'
           Ext.MessageBox.alert('OSS图片服务', error_msg);
           return 0
        }
        var object_name = Ext.getCmp("object").getValue()
        if (typeof(object_name) == 'undefined' || object_name == null || object_name == '')
        {
           var error_msg = "请输入Object！"
           Ext.MessageBox.alert('OSS图片服务', error_msg);
           return 0
        }
        url +=  bucket + '/' + object_name
        return url 
    }

    function get_process_url()
    {
        var bucket = Ext.getCmp("bucket").getValue()
        var object_name = Ext.getCmp("object").getValue()
        url = ''
        var type = Ext.getCmp('combox_cuttype').getValue()
        if (type == 'only_height')
        {
            var height = Ext.getCmp('height').getValue()
            url += '_' + height + 'h'
        }
        else if (type == 'only_width')
        {
            var width = Ext.getCmp('width').getValue()
            url += width + 'w'
        }
        else if (type == 'all_wh')
        {
            var width = Ext.getCmp('width').getValue()
            url += width + 'w'
            var height = Ext.getCmp('height').getValue()
            url += '_' + height + 'h'
            var com_e = Ext.getCmp('combox_e').getValue()
            if (com_e != 'combox_long')
            {
                url += '_' + '1e'
            }
            var com_c = Ext.getCmp('combox_c').getValue()
            if (com_c == 'yes_c')
            {
                url += '_' + '1c'
            }
            var com_i = Ext.getCmp('combox_i').getValue()
            if (com_i == 'yes_i')
            {
                url += '_' + '1i'
            }
        }
        else if (type == 'zoom_complete')
        {
            var width = Ext.getCmp('width').getValue()
            url += width + 'w'
            var height = Ext.getCmp('height').getValue()
            url += '_' + height + 'h'
            url += '_4e'
        }
        else if (type == 'force_wh')
        {
            var width = Ext.getCmp('width').getValue()
            url += width + 'w'
            var height = Ext.getCmp('height').getValue()
            url += '_' + height + 'h'
            url += '_' + '2e'
        }
        else if (type == 'all_cut')
        {
            var x = Ext.getCmp('cut_pos_x').getValue()
            var y = Ext.getCmp('cut_pos_y').getValue()
            var height = Ext.getCmp('cut_height').getValue()
            var width = Ext.getCmp('cut_width').getValue()
            url = url + x + '-' + y + '-' + width + '-' + height  + 'a'
        }
        else if (type == 'region_cut')
        {
            var height = Ext.getCmp('cut_height').getValue()
            var width = Ext.getCmp('cut_width').getValue()
            pos = Ext.getCmp('combox_rc_pos').getValue()
            url = url + width + 'x' + height +'-' + pos + 'rc'
        }
        else if (type == 'auto_cut')
        {
            var height = Ext.getCmp('height').getValue()
            var width = Ext.getCmp('width').getValue()
            url = url + width + 'w_' + height + 'h_1e_1c'
        }

        var com_o = Ext.getCmp('combox_o').getValue()
        if (com_o != 'no_o')
        {
            url += '_' + com_o
        }

        type = Ext.getCmp('combox_q').getValue()
        if (type == 'Q')
        {
            var quality = Ext.getCmp('quality').getValue()
            url += '_' + quality + 'Q'
        }
        else if (type == 'q')
        {
            var quality = Ext.getCmp('quality').getValue()
            url += '_' + quality + 'q'
        }

        /*
        type = Ext.getCmp('filter').getValue()
        if (type != 0)
        {
            url += '_' + type + 'f'
        }
        */
        
        var rotate = Ext.getCmp('rotate').getValue()
        if (rotate != 0)
        {
            url += '_' + rotate + 'r'
        }
        /*
        var saturation = Ext.getCmp('saturation').getValue()
        if (saturation != 0)
        {
            url += '_' + saturation + 's'
        }
        var hue = Ext.getCmp('hue').getValue()
        if (hue != 0)
        {
            url += '_' + hue + 'u'
        }
        */
        var limit = Ext.getCmp('limit').getValue()
        if (limit != 0)
        {
            url += '_' + limit + 'l'
        }
        var sharpen = Ext.getCmp('cb_sharpen').getValue()
        if (sharpen != 0)
        {
            url += '_' + sharpen  + 'sh'
        }

        /*
        var progressive = Ext.getCmp('cb_progressive').getValue()
        if (progressive != 0)
        {
            url += '_' + progressive + 'pr'
        }
        */
        var progressive = Ext.getCmp('checkbox_progressive').getValue().toString()
        if (progressive == 'true')
        {
            url += '_1pr'
        }

        var alpha_white = Ext.getCmp('checkbox_alpha_white').getValue().toString()
        if (alpha_white == 'true')
        {
            url += '_1wh'
        }

        bright = Ext.getCmp('cb_bright').getValue().toString()
        if (bright == 'true')
        {
            value = Ext.getCmp('sl_bright').getValue().toString()
            url += '_' + value + 'b'
        }

        contrast = Ext.getCmp('cb_contrast').getValue().toString()
        if (contrast == 'true')
        {
            value = Ext.getCmp('sl_contrast').getValue().toString()
            url += '_' + value + 'd'
        }
    
        var format = Ext.getCmp('format').getValue()
        url += '.' + format
        return url
   }

   Ext.onReady( function() {
        
        var colorShowId='';
        var cp = new Ext.ColorPalette(); // 初始化时选中的颜色 initial selected color
        var colorWin=new Ext.Window({
        border:false,
        closeAction:'hide',
        closable:false,
        resizable:false,
        width:180,
        height:165,
        items:[cp]
        })
        cp.on('select',function(palette, selColor){
        var color='#'+selColor;
        //alert(colorShowId+','+color);
            Ext.getCmp('font_color').setValue(color)
        Ext.getDom(colorShowId).style.background=color;
        colorWin.hide(); 
        })
        function showColor(id){ 
            colorShowId=id;
            var colorText=Ext.getCmp(id);
            colorWin.x=colorText.getPosition()[0]+colorText.getWidth();
            colorWin.y=colorText.getPosition()[1];   
            colorWin.show();
        }
        var colorField=new Ext.form.TextField({
            id:'wordColor', 
            name:'color',
            xtype:'textfield', 
            labelWidth:10,
            fieldLabel : '  ',
            labelSeparator:' ',
            style:'background:#FFFFFF',
            value: "选择",
            width:53,
            height:20,
            readOnly:true, 
            listeners:{'focus': function(){
               showColor('wordColor');
            }}

        });

        var read_window = Ext.create('widget.window', {
               title:"使用说明", 
               renderTo:Ext.getBody(), 
               //frame:true, 
               //plain:true, 
               modal:true,
               resizable:false, 
               buttonAlign:"center", 
               closeAction:"hide", 
               maximizable:false, 
               closable: true, 
               //bodyStyle:"padding:0px", 
               width: 550, 
               height: 630,
               items: [
               {
                    xtype: 'panel',
                    frame: false,
                    html: read_str
               }
               ]
        });

        var help_window = Ext.create('widget.window', {
               title:"帮助", 
               renderTo:Ext.getBody(), 
               frame:true, 
               plain:true, 
               resizable:false, 
               buttonAlign:"center", 
               closeAction:"hide", 
               maximizable:false, 
               closable: true, 
               bodyStyle:"padding:4px", 
               width: 600, 
               height: 400,
                items: [
                   {
                    xtype: 'tabpanel',
                    items: 
                    [
                        {
                            title: '工具说明',
                            items:
                            [
                                {
                                    xtype: 'htmleditor',
                                    enableColors: false,
                                    enableAlignments: false,
                                    width: 580,
                                    height: 300,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableSourceEdit: false,
                                    enableLinks: false,
                                    enableAlignments: false,
                                    enableColors: false,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableLinks: false,
                                    enableLists: false,
                                    enableSourceEdit: false,
                                    value: help_str,
                                    //disabled: true,
                                    readOnly : true
                                }
                            ]
                        }, 
                        {
                            title: '我要开通',
                            height : 1000,
                            //html: '<a href="http://help.aliyun.com/knowledge_detail.htm?knowledgeId=5973855">开通说明文档</a>'
                            items:
                            [
                                {
                                    xtype: 'htmleditor',
                                    enableColors: false,
                                    enableAlignments: false,
                                    width: 580,
                                    height: 300,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableSourceEdit: false,
                                    enableLinks: false,
                                    enableAlignments: false,
                                    enableColors: false,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableLinks: false,
                                    enableLists: false,
                                    enableSourceEdit: false,
                                    value: g_open_str,
                                    //disabled: true,
                                    readOnly : true
                                }
                            ]
                        },
                        {
                            title: '图片保护',
                            height : 1000,
                            items:
                            [
                                {
                                    xtype: 'htmleditor',
                                    enableColors: false,
                                    enableAlignments: false,
                                    width: 580,
                                    height: 300,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableSourceEdit: false,
                                    enableLinks: false,
                                    enableAlignments: false,
                                    enableColors: false,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableLinks: false,
                                    enableLists: false,
                                    enableSourceEdit: false,
                                    value: g_example_str,
                                    readOnly : true
                                }
                            ]
                        },  
                        {
                            title: 'API说明',
                            height : 1000,
                            html: '<a href="http://docs.aliyun.com/#/oss/oss-img-api/intruduction&brief">新版API使用文档</a>'
                        },
                        {
                            title: '常用问题',
                            height : 1000,
                            items:
                            [
                                {
                                    xtype: 'htmleditor',
                                    enableColors: false,
                                    enableAlignments: false,
                                    width: 580,
                                    height: 300,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableSourceEdit: false,
                                    enableLinks: false,
                                    enableAlignments: false,
                                    enableColors: false,
                                    enableFont: false,
                                    enableFontSize: false,
                                    enableFormat: false,
                                    enableLinks: false,
                                    enableLists: false,
                                    enableSourceEdit: false,
                                    value: g_problem_str,
                                    readOnly : true
                                }
                            ]
                        }
                    ]
                }]
            });

       var help_window2=new Ext.Window({ 
           title:"帮助", 
           renderTo:Ext.getBody(), 
           frame:true, 
           plain:true, 
           resizable:false, 
           buttonAlign:"center", 
           closeAction:"hide", 
           maximizable:false, 
           closable: true, 
           bodyStyle:"padding:4px", 
           width: 600, 
           height: 400,
            defaults: {
                labelWidth: 60
            },
           items:[
           {
                xtype: 'htmleditor',
                enableColors: false,
                enableAlignments: false,
                width: 580,
                height: 300,
                enableFont: false,
                enableFontSize: false,
                enableFormat: false,
                enableSourceEdit: false,
                enableLinks: false,
                enableAlignments: false,
                enableColors: false,
                enableFont: false,
                enableFontSize: false,
                enableFormat: false,
                enableLinks: false,
                enableLists: false,
                enableSourceEdit: false,
                value: help_str,
                //disabled: true,
                readOnly : true
           }
           ]
       })

       var _window=new Ext.Window({ 
           title:"OSS图片处理工具4.0", 
           renderTo:Ext.getBody(), 
           //frame:true, 
           //plain:true, 
           resizable:false, 
           buttonAlign:"center", 
           closeAction:"hide", 
           maximizable:false, 
           closable:false, 
           bodyStyle:"padding:4px", 
           width:1000, 
           //height:290, 
           height:685, 
           //layout:"form", 
           //lableWidth:30, 
           //defaults:{xtype:"textfield"}, 
            items:[
            {
                xtype: 'fieldcontainer',
                fieldLabel: '',
                combineErrors: false,
                anchor: '100%',
                layout:'column',
            items: [
            {   
                columnWidth:.5,
                xtype: 'fieldcontainer',
                fieldLabel: '',
                combineErrors: false,
                items: [
                {
                    xtype: 'fieldset',
                    title: '图片源信息',
                    width : 450,
                    collapsible: false,
                    defaults: {
                        labelWidth: 70
                    },
                    items: [
                        {
                            xtype:"textfield",
                            id: 'bucket',
                            fieldLabel: '域名',
                            width: 420,
                            value: '',
                            emptyText: '输入OSS图片服务设置的域名信息, 即你开通所用的域名',
                            blankText: '域名不能为空',
                            allowBlank:false
                        },{
                            xtype:"textfield",
                            id: 'object',
                            fieldLabel: '文件名',
                            emptyText: '输入Object名字',
                            blankText: 'Object不能为空',
                            width: 420,
                            value: '',
                            allowBlank:false
                   }]},
            {
                xtype: 'fieldset',
                title: '图片处理',
                width : 450,
                id : 'fs_process',
                collapsible: false,
                checkboxToggle: true,
                defaults: {
                    labelWidth: 70
                },
                /*
                listeners :{
                    'collapse':function()
                    {
                        _window.height = _window.height + 200
                        _window.center()
                    },
                    'expand':function()
                    {
                        _window.height = _window.height - 200
                        _window.center()
                    }
                },
                */
                items: [
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_1',
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items : [
                            {
                                width:          175,
                                xtype:          'combo',
                                mode:           'local',
                                id:             'combox_cuttype',
                                value:          'all_wh',
                                triggerAction:  'all',
                                forceSelection: true,
                                editable:       false,
                                fieldLabel:     '处理类型',
                                labelWidth: 70,
                                name:           'title',
                                displayField:   'name',
                                valueField:     'value',
                                queryMode: 'local',
                                store:          Ext.create('Ext.data.Store', {
                                    fields : ['name', 'value'],
                                    data   : [
                                        {name : '自动裁剪',   value: 'auto_cut'},
                                        {name : '只指定高度',   value: 'only_height'},
                                        {name : '只指定宽度',   value: 'only_width'},
                                        {name : '强制宽高',   value: 'force_wh'},
                                        {name : '指定宽高',   value: 'all_wh'},
                                        {name : '高级裁剪',   value: 'all_cut'},
                                        {name : '区域裁剪',   value: 'region_cut'},
                                        {name : '缩略补全',   value: 'zoom_complete'},
                                        {name : '不缩放',   value: 'no_wh'}
                                    ]
                                }),
				listeners :{
                                'change':function(){
				    //Ext.getCmp('text_quality').setValue(Ext.getCmp('quality').getValue())
				    //alert(Ext.getCmp('combox_cuttype').getValue())
				    var type = Ext.getCmp('combox_cuttype').getValue()
				    if (type == 'only_width')
			        {	
                        Ext.getCmp('fc_2').setVisible(true)
                        //Ext.getCmp('fc_3').setVisible(true)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('fc_cut').setVisible(false)
                        Ext.getCmp('fc_cut_pos').setVisible(false)
                        Ext.getCmp('combox_rc_pos').setVisible(false)

                        Ext.getCmp('height').setDisabled(true)
                        Ext.getCmp('width').setDisabled(false)
                        Ext.getCmp('combox_i').setDisabled(true)
                        //Ext.getCmp('combox_o').setDisabled(true)
                        //Ext.getCmp('combox_e').setDisabled(true)
                        Ext.getCmp('combox_c').setDisabled(true)
				    }
				    else if(type == 'only_height')
				    {
                        Ext.getCmp('fc_2').setVisible(true)
                        //Ext.getCmp('fc_3').setVisible(true)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('fc_cut').setVisible(false)
                        Ext.getCmp('fc_cut_pos').setVisible(false)
                        Ext.getCmp('combox_rc_pos').setVisible(false)

                        Ext.getCmp('width').setDisabled(true)
                        Ext.getCmp('height').setDisabled(false)
                        Ext.getCmp('combox_i').setDisabled(true)
                        //Ext.getCmp('combox_o').setDisabled(true)
                        //Ext.getCmp('combox_e').setDisabled(true)
                        Ext.getCmp('combox_c').setDisabled(true)
				    }
				    else if (type == 'all_wh')
				    {
                        Ext.getCmp('fc_2').setVisible(true)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(true)
                        Ext.getCmp('fc_cut').setVisible(false)
                        Ext.getCmp('fc_cut_pos').setVisible(false)

                        Ext.getCmp('combox_rc_pos').setVisible(false)
                        Ext.getCmp('height').setDisabled(false)
                        Ext.getCmp('width').setDisabled(false)
                        Ext.getCmp('combox_i').setDisabled(false)
                        Ext.getCmp('combox_o').setDisabled(false)
                        Ext.getCmp('combox_e').setDisabled(false)
                        Ext.getCmp('combox_c').setDisabled(false)
				    }
				    else if (type == 'all_cut')
				    {
                        Ext.getCmp('fc_2').setVisible(false)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('combox_rc_pos').setVisible(false)

                        Ext.getCmp('fc_cut').setVisible(true)
                        Ext.getCmp('fc_cut_pos').setVisible(true)
				    }
				    else if (type == 'region_cut')
				    {
                        Ext.getCmp('fc_2').setVisible(false)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('combox_rc_pos').setVisible(true)

                        Ext.getCmp('fc_cut').setVisible(true)
                    }
                    else if (type == 'zoom_complete')
                    {
                        //Ext.getCmp('fc_2').setVisible(false)
                        //Ext.getCmp('fc_4').setVisible(true)
                        //Ext.getCmp('combox_e').setVisible(false)
                        //Ext.getCmp('combox_rc_pos').setVisible(true)
                        //Ext.getCmp('fc_cut').setVisible(true)
                        Ext.getCmp('fc_2').setVisible(true)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('height').setDisabled(false)
                        Ext.getCmp('width').setDisabled(false)
                        Ext.getCmp('combox_rc_pos').setVisible(false)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('fc_cut').setVisible(false)
                        Ext.getCmp('fc_cut_pos').setVisible(false)
                    }
				    else if (type == 'auto_cut')
				    {
                        Ext.getCmp('fc_2').setVisible(true)
                        //Ext.getCmp('fc_3').setVisible(true)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('combox_rc_pos').setVisible(false)
                        Ext.getCmp('fc_cut').setVisible(false)
                        Ext.getCmp('fc_cut_pos').setVisible(false)

                        Ext.getCmp('width').setDisabled(false)
                        Ext.getCmp('height').setDisabled(false)
                        Ext.getCmp('combox_i').setDisabled(true)
                        Ext.getCmp('combox_c').setDisabled(true)
				    }
				    else if (type == 'force_wh')
				    {
                        Ext.getCmp('fc_2').setVisible(true)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('combox_rc_pos').setVisible(false)
                        Ext.getCmp('fc_cut').setVisible(false)
                        Ext.getCmp('fc_cut_pos').setVisible(false)

                        Ext.getCmp('height').setDisabled(false)
                        Ext.getCmp('width').setDisabled(false)
                        Ext.getCmp('combox_i').setDisabled(false)
                        Ext.getCmp('combox_o').setDisabled(false)
                        //Ext.getCmp('combox_e').setDisabled(false)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('combox_c').setDisabled(false)
                    }
                    else if (type == 'no_wh')
                    {
                        Ext.getCmp('fc_2').setVisible(false)
                        //Ext.getCmp('fc_3').setVisible(false)
                        Ext.getCmp('fc_4').setVisible(true)
                        Ext.getCmp('combox_e').setVisible(false)
                        Ext.getCmp('combox_rc_pos').setVisible(false)
                        Ext.getCmp('fc_cut').setVisible(false)
                        Ext.getCmp('fc_cut_pos').setVisible(false)
                    }
				}
			    }
                            },
                            {
                               xtype: 'displayfield',
                               width: 30
                            },
                            {
                                width:          175,
                                xtype:          'combo',
                                mode:           'local',
                                id:             'combox_e',
                                value:          'combox_long',
                                triggerAction:  'all',
                                forceSelection: true,
                                editable:       false,
                                fieldLabel:     '缩放优先',
                                labelWidth: 70,
                                name:           'title',
                                displayField:   'name',
                                valueField:     'value',
                                queryMode: 'local',
                                store:          Ext.create('Ext.data.Store', {
                                    fields : ['name', 'value'],
                                    data   : [
                                        {name : '长边优先',   value: 'combox_long'},
                                        {name : '短边优先',   value: 'combox_short'}
                                    ]
                                })
                            }
                            ,
                            {
                                width:          175,
                                xtype:          'combo',
                                mode:           'local',
                                id:             'combox_rc_pos',
                                value:          '1',
                                triggerAction:  'all',
                                forceSelection: true,
                                editable:       false,
                                hidden : true,
                                fieldLabel:     '裁剪区域',
                                labelWidth:     70,
                                name:           'title',
                                displayField:   'name',
                                valueField:     'value',
                                queryMode: 'local',
                                store:          Ext.create('Ext.data.Store', {
                                    fields : ['name', 'value'],
                                    data   : [
                                        {name : '左上1',   value: '1'},
                                        {name : '上2',   value: '2'},
                                        {name : '右上3',   value: '3'},
                                        {name : '左4',   value: '4'},
                                        {name : '中5',   value: '5'},
                                        {name : '右6',   value: '6'},
                                        {name : '左下7',   value: '7'},
                                        {name : '下8',   value: '8'},
                                        {name : '右下9',   value: '9'}
                                    ]
                                })
                            }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_cut_pos',
                        hidden : true,
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                           {
                               xtype: 'numberfield',
                               fieldLabel: '起始横标',
                               labelWidth: 70,
                               maxValue: 4096,  
                               minValue: 0,
                               id : 'cut_pos_x',
                               width: 175,
                               value : 0,
                               allowBlank: false
                           },
                           {
                               xtype: 'displayfield',
                               width: 30,
                               value: 'px'
                           },
                           {
                               id : 'cut_pos_y',
                               xtype: 'numberfield',
                               fieldLabel: '起始纵标',
                               labelWidth: 70,
                               maxValue: 4096,  
                               minValue: 0,
                               width: 175,
                               value : 0,
                               allowBlank: false
                           },
                           {
                               xtype: 'displayfield',
                               value: 'px'
                           }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_cut',
                        hidden : true,
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                           {
                               name : 'cut_width',
                               xtype: 'numberfield',
                               fieldLabel: '裁剪宽度',
                               labelWidth: 70,
                               maxValue: 4096,  
                               minValue: 0,
                               id : 'cut_width',
                               width: 175,
                               value : 0,
                               allowBlank: false
                           },
                           {
                               xtype: 'displayfield',
                               width: 30,
                               value: 'px'
                           },
                           {
                               id : 'cut_height',
                               xtype: 'numberfield',
                               fieldLabel: '裁剪高度',
                               labelWidth: 70,
                               maxValue: 4096,  
                               minValue: 0,
                               width: 175,
                               value : 0,
                               allowBlank: false
                           },
                           {
                               xtype: 'displayfield',
                               value: 'px'
                           }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_2',
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                           {
                               name : 'width',
                               xtype: 'numberfield',
                               fieldLabel: '缩略宽度',
                               labelWidth: 70,
                               maxValue: 4096,  
                               minValue: 1,
                               id : 'width',
                               width: 175,
                               value : 300,
                               allowBlank: false
                           },
                           {
                               xtype: 'displayfield',
                               width: 30,
                               value: 'px'
                           },
                           {
                               //name : 'height',
                               id : 'height',
                               xtype: 'numberfield',
                               fieldLabel: '缩略高度',
                               labelWidth: 70,
                               maxValue: 4096,  
                               minValue: 1,
                               width: 175,
                               value : 300,
                               allowBlank: false
                           },
                           {
                               xtype: 'displayfield',
                               value: 'px'
                           }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        hidden:         'true',
                        id: 'fc_3',
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                            {
                                width:          175,
                                xtype:          'combo',
                                mode:           'local',
                                id:             'combox_c',
                                value:          'no_c',
                                triggerAction:  'all',
                                forceSelection: true,
                                editable:       false,
                                fieldLabel:     '裁剪类型',
                                labelWidth: 70,
                                name:           'title',
                                displayField:   'name',
                                valueField:     'value',
                                queryMode: 'local',
                                store:          Ext.create('Ext.data.Store', {
                                    fields : ['name', 'value'],
                                    data   : [
                                        {name : '不进行裁剪',   value: 'no_c'},
                                        {name : '进行裁剪',   value: 'yes_c'}
                                    ]
                                }),
                                listeners :{
                                    'change':function(){
                                        var type = Ext.getCmp('combox_c').getValue()
                                        if (type == 'no_c')
                                        {
                                        Ext.getCmp('combox_i').setDisabled(true)
                                        }
                                        else
                                        {
                                        Ext.getCmp('combox_i').setDisabled(false)
                                        }
                                    }
                                }
                           },
                           {
                               xtype: 'displayfield',
                               width: 30
                           },
                            {
                                width:          175,
                                xtype:          'combo',
                                mode:           'local',
                                id:             'combox_i',
                                value:          'no_i',
                                triggerAction:  'all',
                                forceSelection: true,
                                editable:       false,
                                fieldLabel:     '固定宽高',
                                labelWidth: 70,
				                disabled: true,
                                name:           'title',
                                displayField:   'name',
                                valueField:     'value',
                                queryMode: 'local',
                                store:          Ext.create('Ext.data.Store', {
                                    fields : ['name', 'value'],
                                    data   : [
                                        {name : '不固定宽高',   value: 'no_i'},
                                        {name : '固定宽高',   value: 'yes_i'}
                                    ]
                                })
                            }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_4',
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                        {
                            xtype: 'fieldcontainer',
                            fieldLabel: '旋转角度',
                            combineErrors: false,
                            id: 'fc_pic_multi',
                            defaults: {
                                hideLabel: true
                            },
                            labelWidth: 70,
                            anchor: '100%',
                            layout: {
                                type: 'hbox',
                                defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                            },
                            items: [
                               {
                                   id : 'rotate',
                                   xtype: 'numberfield',
                                   width: 100,
                                   maxValue: 360,  
                                   minValue: 0,
                                   value : 0,
                                   allowBlank: false
                               },
                               {
                                   xtype: 'displayfield',
                                   width: 26
                               }
                            ]
                        },
                        {
                            width:          175,
                            xtype:          'combo',
                            mode:           'local',
                            id:             'combox_o',
                            value:          'no_o',
                            triggerAction:  'all',
                            forceSelection: true,
                            editable:       false,
                            fieldLabel:     '适应方向',
                            labelWidth: 70,
                            name:           'title',
                            displayField:   'name',
                            valueField:     'value',
                            queryMode: 'local',
                            store:          Ext.create('Ext.data.Store', {
                                fields : ['name', 'value'],
                                data   : [
                                    {name : '自适应方向,先旋转',   value: '2o'},
                                    {name : '自适应方向,后旋转',   value: '1o'},
                                    {name : '按原图默认',   value: 'no_o'}
                                ]
                            })
                        }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_19',
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                        {
                            width:          175,
                            labelWidth:     70,
                            xtype:          'combo',
                            mode:           'local',
                            id:             'limit',
                            value:          '0',
                            triggerAction:  'all',
                            forceSelection: true,
                            editable:       false,
                            fieldLabel:     '缩略限制',
                            name:           'title',
                            displayField:   'name',
                            valueField:     'value',
                            queryMode: 'local',
                            store: Ext.create('Ext.data.Store', {
                                fields : ['name', 'value'],
                                data   : [
                                    {name : '不限制',   value: '0'},
                                    {name : '指定缩略大于原图不缩略',   value: '1'}
                                ]
                            })
                        }
                        ,
                        {
                           xtype: 'displayfield',
                           width: 30
                        },
                        {
                            width:          175,
                            labelWidth:     70,
                            xtype:          'combo',
                            mode:           'local',
                            id:             'cb_sharpen',
                            value:          '0',
                            triggerAction:  'all',
                            forceSelection: true,
                            editable:       false,
                            fieldLabel:     '图片锐化',
                            name:           'title',
                            displayField:   'name',
                            valueField:     'value',
                            queryMode: 'local',
                            store: Ext.create('Ext.data.Store', {
                                fields : ['name', 'value'],
                                data   : [
                                    {name : '不开启',   value: '0'},
                                    {name : '开启',   value: '1'}
                                ]
                            })
                        }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_5',
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                        {
                            width:          175,
                            labelWidth:     70,
                            xtype:          'combo',
                            mode:           'local',
                            id:             'format',
                            value:          'jpg',
                            triggerAction:  'all',
                            forceSelection: true,
                            editable:       false,
                            fieldLabel:     '图片格式',
                            name:           'title',
                            displayField:   'name',
                            valueField:     'value',
                            queryMode: 'local',
                            store: Ext.create('Ext.data.Store', {
                                fields : ['name', 'value'],
                                data   : [
                                    {name : '原图格式',   value: 'src'},
                                    {name : 'jpg',   value: 'jpg'},
                                    {name : 'webp',  value: 'webp'},
                                    {name : 'bmp',  value: 'bmp'},
                                    {name : 'png', value: 'png'}
                                ]
                            }),
                            listeners :{
                               'change':function(){
                                    var type = Ext.getCmp('format').getValue()
                                    if (type == 'jpg' || type == 'jpeg')
                                    {	
                                        Ext.getCmp('combox_q').setDisabled(false)
                                        if (Ext.getCmp('combox_q').getValue() != 'no')
                                        {
                                            Ext.getCmp('quality').setDisabled(false)
                                        }
                                        Ext.getCmp('cb_progressive').setDisabled(false)
                                        Ext.getCmp('checkbox_progressive').setDisabled(false)
                                        Ext.getCmp('checkbox_alpha_white').setDisabled(false)
                                    }
                                    else
                                    {
                                        Ext.getCmp('cb_progressive').setDisabled(true)
                                        Ext.getCmp('combox_q').setDisabled(true)
                                        Ext.getCmp('quality').setDisabled(true)
                                        Ext.getCmp('checkbox_progressive').setDisabled(true)
                                        Ext.getCmp('checkbox_alpha_white').setDisabled(true)
                                    }
                                }
                            }
                        },
                        {
                           xtype: 'displayfield',
                           width: 30
                        },
                        {
                            width:          175,
                            labelWidth:     70,
                            xtype:          'combo',
                            mode:           'local',
                            id:             'cb_progressive',
                            value:          '0',
                            hidden:         true,
                            triggerAction:  'all',
                            forceSelection: true,
                            editable:       false,
                            fieldLabel:     '渐进显示',
                            name:           'title',
                            displayField:   'name',
                            valueField:     'value',
                            queryMode: 'local',
                            store: Ext.create('Ext.data.Store', {
                                fields : ['name', 'value'],
                                data   : [
                                    {name : '不开启',   value: '0'},
                                    {name : '开启',   value: '1'}
                                ]
                            })
                        }
                        ,
                        {
                            xtype : 'checkbox',
                            fieldLabel: '渐进显示:',
                            labelWidth:58,
                            id: 'checkbox_progressive'
                        }
                        ,
                        {
                           xtype: 'displayfield',
                           disabled : true,
                           width: 20
                        }
                        ,
                        {
                            xtype : 'checkbox',
                            fieldLabel: '透明补白:',
                            labelWidth:58,
                            id: 'checkbox_alpha_white'
                        }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_6',
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                            {
                                xtype:          'combo',
                                width:          175,
                                mode:           'local',
                                id:             'combox_q',
                                value:          'q',
                                triggerAction:  'all',
                                forceSelection: true,
                                editable:       false,
                                labelWidth:     70,
                                fieldLabel:     '质量类型',
                                name:           'title',
                                displayField:   'name',
                                valueField:     'value',
                                queryMode: 'local',
                                store:          Ext.create('Ext.data.Store', {
                                fields : ['name', 'value'],
                                data   : [
                                    {name : '绝对质量',   value: 'Q'},
                                    {name : '相对质量',   value: 'q'},
                                    {name : '不压缩',   value: 'no'}
                                ]
                                }),
                                listeners :{
                                   'change':function(){
                                        var type = Ext.getCmp('combox_q').getValue()
                                        if (type == 'Q')
                                        {	
                                        Ext.getCmp('quality').setDisabled(false)
                                        //Ext.getCmp('text_quality').setDisabled(false)
                                        }
                                        else if (type == 'q')
                                        {	
                                        Ext.getCmp('quality').setDisabled(false)
                                        //Ext.getCmp('text_quality').setDisabled(false)
                                        }
                                        else
                                        {
                                        Ext.getCmp('quality').setDisabled(true)
                                        //Ext.getCmp('text_quality').setDisabled(true)
                                        }
                                    }
                                }
                            },
                            {
                                xtype: 'sliderfield',
                                width: 180,
                                fieldLabel: '质量参数',
                                hideLabel: true,
                                labelWidth:70,
                                value: 90,
                                id : 'quality',
                                minValue: 1,
                                maxValue: 100,
                                name: 'quality',
                                listeners :{
                                    'change':function(){
                                        Ext.getCmp('text_quality').setValue(Ext.getCmp('quality').getValue())
                                    }
                                }
                            }
                            ,
                            {
                                xtype:"textfield",
                                id: 'text_quality',
                                disabled : true,
                                width: 40,
                                value: '90'
                            }
                        ]
                    }
                    ,
                    {
                        xtype: 'fieldcontainer',
                        fieldLabel: '调节亮度',
                        id:'fc_bright',
                        combineErrors: false,
                        //hidden: true,
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        defaults: {
                            hideLabel: true
                        },
                        items: [
                           {
                                xtype : 'checkbox',
                                labelWidth:     70,
                                id: 'cb_bright',
                                listeners :{
                                    'change': function (checkbox, isChecked) 
                                    {
                                        if (isChecked == true)
                                        {
                                            Ext.getCmp('sl_bright').setDisabled(false)
                                            Ext.getCmp('df_bright').setDisabled(false)
                                        }
                                        else
                                        {
                                            Ext.getCmp('sl_bright').setDisabled(true)
                                            Ext.getCmp('df_bright').setDisabled(true)
                                        }
                                    }
                                }
                           }
                           ,
                           {
                               xtype: 'displayfield',
                               disabled : true,
                               width: 25
                           }
                           ,
                           {
                               xtype: 'displayfield',
                               id : 'df_bright',
                               disabled : true,
                               value: '暗<->亮:'
                           },
                           {
                                xtype: 'sliderfield',
                                width: 180,
                                value: 0,
                                minValue: -100,
                                maxValue: 100,
                                disabled : true,
                                id : 'sl_bright',
                                listeners :{
                                    'change':function(){
                                        Ext.getCmp('tx_bright').setValue(Ext.getCmp('sl_bright').getValue())
                                    }
                                }
                           }
                           ,
                           {
                                xtype:"textfield",
                                id: 'tx_bright',
                                disabled : true,
                                width: 40,
                                height: 20,
                                value: '0'
                           }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        fieldLabel: '调对比度',
                        id:'fc_contrast',
                        combineErrors: false,
                        //hidden: true,
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        defaults: {
                            hideLabel: true
                        },
                        items: [
                           {
                                xtype : 'checkbox',
                                labelWidth:     70,
                                id: 'cb_contrast',
                                listeners :{
                                    'change': function (checkbox, isChecked) 
                                    {
                                        if (isChecked == true)
                                        {
                                            Ext.getCmp('sl_contrast').setDisabled(false)
                                            Ext.getCmp('df_contrast').setDisabled(false)
                                        }
                                        else
                                        {
                                            Ext.getCmp('sl_contrast').setDisabled(true)
                                            Ext.getCmp('df_contrast').setDisabled(true)
                                        }
                                    }
                                }
                           }
                           ,
                           {
                               xtype: 'displayfield',
                               disabled : true,
                               width: 25
                           }
                           ,
                           {
                               xtype: 'displayfield',
                               id : 'df_contrast',
                               disabled : true,
                               value: '低<->高:'
                           },
                           {
                                xtype: 'sliderfield',
                                width: 180,
                                value: 90,
                                value: 0,
                                minValue: -100,
                                maxValue: 100,
                                disabled : true,
                                id : 'sl_contrast',
                                listeners :{
                                    'change':function(){
                                        Ext.getCmp('tx_contrast').setValue(Ext.getCmp('sl_contrast').getValue())
                                    }
                                }
                           }
                           ,
                           {
                                xtype:"textfield",
                                id: 'tx_contrast',
                                disabled : true,
                                width: 40,
                                height: 20,
                                value: '0'
                           }
                        ]
                    }
                ]
            },
            {
                xtype: 'fieldset',
                title: '图片美化',
                width : 450,
                hidden : true,
                collapsible: false,
                id : 'fs_beautify',
                collapsed : true,
                checkboxToggle: true,
                defaults: {
                    labelWidth: 70
                },
                /*
                listeners :{
                    'collapse':function()
                    {
                        _window.height = _window.height + 100
                        _window.center()
                    },
                    'expand':function()
                    {
                        _window.height = _window.height - 100
                        _window.center()
                    }
                },
                */
                items: [
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_22',
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                            {
                                xtype: 'sliderfield',
                                fieldLabel: '亮度',
                                labelWidth: 45,
                                width: 320,
                                value: 0,
                                minValue: -100,
                                maxValue: 100,
                                id : 'bright',
                                listeners :{
                                    'change':function(){
                                        Ext.getCmp('text_bright').setValue(Ext.getCmp('bright').getValue())
                                        show_result()
                                    }
                                }
                            }
                            ,
                            {
                                xtype:"textfield",
                                id: 'text_bright',
                                disabled : true,
                                width: 40,
                                value: '0'
                            },
                            {
                                xtype:"button",
                                width: 40,
                                text: '复原',
                                listeners:{ 
                                   "click":function() 
                                   {
                                       Ext.getCmp('bright').setValue(0)
                                   }
                                }
                            }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        combineErrors: false,
                        id: 'fc_23',
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        items: [
                            {
                                xtype: 'sliderfield',
                                fieldLabel: '对比度',
                                labelWidth: 45,
                                width: 320,
                                value: 0,
                                minValue: -100,
                                maxValue: 100,
                                id : 'contrast',
                                listeners :{
                                    'change':function(){
                                        Ext.getCmp('text_contrast').setValue(Ext.getCmp('contrast').getValue())
                                        show_result()
                                    }
                                }
                            },
                            {
                                xtype:"textfield",
                                id: 'text_contrast',
                                disabled : true,
                                width: 40,
                                value: '0'
                            },
                            {
                                xtype:"button",
                                width: 40,
                                text: '复原',
                                listeners:{ 
                                   "click":function() 
                                   {
                                       Ext.getCmp('contrast').setValue(0)
                                   }
                                }
                            }
                        ]
                    }
                ]
            },
            {
                xtype: 'fieldset',
                title: '水印信息',
                checkboxToggle: true,
                id : 'fs_watermark',
                collapsible: false,
                collapsed : true,
                width : 450,
                defaults: {
                    labelWidth: 70
                },
                /*
                listeners :{
                    'collapse':function()
                    {
                        _window.height = _window.height + 100
                        _window.center()
                    },
                    'expand':function()
                    {
                        _window.height = _window.height - 100
                        _window.center()
                    }
                },
                */
                items: [
                       {
                            xtype: 'radiogroup',
                            fieldLabel: '水印类型',
                            id : 'watermark-type',
                            name : 'watermark-type',
                            //cls: 'x-check-group-alt',
                            items: [
                                {boxLabel: '文字水印', id:'font-wm', name: 'watermark-type', inputValue: '2', checked: true},
                                {boxLabel: '图片水印', id:'image-wm', name: 'watermark-type', inputValue: '3'},
                                {boxLabel: '文图混合', id:'font-image-wm', name: 'watermark-type', inputValue: '4'}
                            ]
                            ,
                            listeners :{
                                'change':function(){
                                    if (Ext.getCmp("font-wm").getValue() == true)
                                    {
                                        _window.center()
                                        if (Ext.getCmp('wm-pos').isVisible() == false)
                                        {
                                            //_window.height = _window.height + 155
                                        }
                                        else
                                        {
                                            //_window.height = _window.height
                                        }
                                        Ext.getCmp('fc_font_img_sort').setVisible(false)
                                        Ext.getCmp('fc_11').setVisible(false)
                                        Ext.getCmp('fc_18').setVisible(false)
                                        Ext.getCmp('image_font_url').setVisible(true)
                                        Ext.getCmp('font-size-con').setVisible(true)
                                        Ext.getCmp('font-shadown-con').setVisible(true)
                                        Ext.getCmp('transparent-con').setVisible(true)
                                        Ext.getCmp('wm-pos').setVisible(true)
                                        _window.center()
                                    }
                                    else if (Ext.getCmp("image-wm").getValue() == true)
                                    {
                                        if (Ext.getCmp('wm-pos').isVisible() == false)
                                        {
                                            //_window.height = _window.height + 155
                                        }
                                        else
                                        {
                                            //_window.height = _window.height
                                        }
                                        _window.center()
                                        Ext.getCmp('fc_font_img_sort').setVisible(false)
                                        Ext.getCmp('fc_11').setVisible(true)
                                        Ext.getCmp('fc_18').setVisible(true)
                                        Ext.getCmp('image_font_url').setVisible(false)
                                        Ext.getCmp('font-size-con').setVisible(false)
                                        Ext.getCmp('transparent-con').setVisible(true)
                                        Ext.getCmp('font-shadown-con').setVisible(false)
                                        Ext.getCmp('wm-pos').setVisible(true)
                                        
                                        if (Ext.getCmp("leftup").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(true)
                                            Ext.getCmp('h_margins-container').setVisible(true)
                                            Ext.getCmp('fc_wm_offset').setVisible(false)
                                        }
                                        else if (Ext.getCmp("left").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(false)
                                            Ext.getCmp('h_margins-container').setVisible(true)
                                            Ext.getCmp('fc_wm_offset').setVisible(true)
                                        }
                                        else if (Ext.getCmp("leftdown").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(true)
                                            Ext.getCmp('h_margins-container').setVisible(true)
                                            Ext.getCmp('fc_wm_offset').setVisible(false)
                                        }
                                        else if (Ext.getCmp("up").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(true)
                                            Ext.getCmp('h_margins-container').setVisible(false)
                                            Ext.getCmp('fc_wm_offset').setVisible(false)
                                        }
                                        else if (Ext.getCmp("center").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(false)
                                            Ext.getCmp('h_margins-container').setVisible(false)
                                            Ext.getCmp('fc_wm_offset').setVisible(true)
                                        }
                                        else if (Ext.getCmp("down").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(true)
                                            Ext.getCmp('h_margins-container').setVisible(false)
                                            Ext.getCmp('fc_wm_offset').setVisible(false)
                                        }
                                        else if (Ext.getCmp("rightup").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(true)
                                            Ext.getCmp('h_margins-container').setVisible(true)
                                            Ext.getCmp('fc_wm_offset').setVisible(false)
                                        }
                                        else if (Ext.getCmp("right").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(false)
                                            Ext.getCmp('h_margins-container').setVisible(true)
                                            Ext.getCmp('fc_wm_offset').setVisible(true)
                                        }
                                        else if (Ext.getCmp("rightdown").getValue() == true)
                                        {
                                            Ext.getCmp('v_margins-container').setVisible(true)
                                            Ext.getCmp('h_margins-container').setVisible(true)
                                            Ext.getCmp('fc_wm_offset').setVisible(false)
                                        }
                                        _window.center()
                                    }
                                    else if (Ext.getCmp("font-image-wm").getValue() == true)
                                    {
                                        Ext.getCmp('fc_font_img_sort').setVisible(true)
                                        Ext.getCmp('fc_11').setVisible(false)
                                        Ext.getCmp('fc_18').setVisible(false)
                                        Ext.getCmp('image_font_url').setVisible(false)
                                        Ext.getCmp('font-size-con').setVisible(false)
                                        Ext.getCmp('transparent-con').setVisible(true)
                                        Ext.getCmp('font-shadown-con').setVisible(false)
                                        Ext.getCmp('wm-pos').setVisible(true)
                                    }
                                }
                            }
                       }, 
                       {
                            xtype: 'fieldcontainer',
                            combineErrors: false,
                            hidden: true,
                            id: 'fc_11',
                            defaults: {
                                //hideLabel: true
                            },
                            anchor: '100%',
                            layout: {
                                type: 'hbox',
                                defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                            },
                            items: [
                            {
                                xtype : 'textfield',
                                value : '',
                                width : 425,
                                name: 'image_wm_url',
                                fieldLabel:'水印图片',
                                labelWidth: 70,
                                emptyText: '请输入水印Object',
                                blankText: '水印Object不能为空',
                                allowBlank:false,
                                id: 'image_wm_url'
                            }
                            ]
                       },
                       {
                            xtype: 'fieldcontainer',
                            combineErrors: false,
                            hidden: true,
                            id: 'fc_18',
                            defaults: {
                                //hideLabel: true
                            },
                            anchor: '100%',
                            layout: {
                                type: 'hbox',
                                defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                            },
                            items: [
                            {
                                xtype : 'checkbox',
                                labelWidth:     70,
                                fieldLabel: '水印处理',
                                id: 'cb_wm_process',
                                listeners :{
                                    'change': function (checkbox, isChecked) 
                                    {
                                        if (isChecked == true)
                                        {
                                            /*
                                            Ext.getCmp('wm_df_1').setDisabled(false)
                                            Ext.getCmp('wm_df_2').setDisabled(false)
                                            Ext.getCmp('wm_df_3').setDisabled(false)
                                            Ext.getCmp('wm_df_0').setDisabled(false)
                                            Ext.getCmp('image_wm_c').setDisabled(false)
                                            Ext.getCmp('image_wm_b').setDisabled(false)
                                            */
                                            Ext.getCmp('cb_wm_p').setDisabled(false)
                                            Ext.getCmp('image_wm_p').setDisabled(false)
                                        }
                                        else
                                        {
                                            Ext.getCmp('image_wm_p').setDisabled(true)
                                            Ext.getCmp('cb_wm_p').setDisabled(true)
                                            /*
                                            Ext.getCmp('wm_df_1').setDisabled(true)
                                            Ext.getCmp('wm_df_2').setDisabled(true)
                                            Ext.getCmp('wm_df_3').setDisabled(true)
                                            Ext.getCmp('wm_df_0').setDisabled(true)
                                            Ext.getCmp('image_wm_p').setDisabled(true)
                                            Ext.getCmp('image_wm_c').setDisabled(true)
                                            Ext.getCmp('image_wm_b').setDisabled(true)
                                            */
                                        }
                                    }
                                }
                            },
                            {
                                width:          250,
                                xtype:          'combo',
                                mode:           'local',
                                value:          'P',
                                id :            'cb_wm_p',
                                disabled : true,
                                    triggerAction:  'all',
                                    forceSelection: true,
                                    editable:       false,
                                    labelWidth :    60,
                                    fieldLabel:     '缩放类型',
                                    name:           'title',
                                    displayField:   'name',
                                    valueField:     'value',
                                    queryMode: 'local',
                                    store:          Ext.create('Ext.data.Store', {
                                        fields : ['name', 'value'],
                                        data   : [
                                            {name : '基于水印图的缩放比例',   value: 'p'},
                                            {name : '基于主图片的缩放比例',   value: 'P'}
                                        ]
                                    })
                            },
                            {
                                xtype : 'numberfield',
                                width : 58,
                                value : 30,
                                minValue: 1,
                                maxValue: 1000,
                                disabled : true,
                                id: 'image_wm_p'
                            }
                            ,
                            {
                               xtype: 'displayfield',
                               disabled : true,
                               id : 'wm_df_0',
                               value: '%'
                            }
                         ]
                       },
                       {
                            xtype : 'textfield',
                            fieldLabel: '文字内容',
                            width : 420,
                            name: 'image_font_url',
                            value: 'Hello 图片服务!',
                            //hidden: true,
                            id: 'image_font_url'
                       },
                       {
                            xtype : 'fieldcontainer',
                            combineErrors: true,
                            msgTarget: 'side',
                            fieldLabel: '排版方式',
                            value: 70,
                            hidden: true,
                            id : 'fc_font_img_sort',
                            labelWidth: 70,
                            anchor: '100%',
                            layout: {
                                type: 'hbox',
                                defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                            },
                            defaults: {
                                hideLabel: true
                            },
                            items : [
                                {
                                    width:          100,
                                    xtype:          'combo',
                                    mode:           'local',
                                    value:          'img-first',
                                    id :            'combox_fontimg_sort',
                                    triggerAction:  'all',
                                    forceSelection: true,
                                    editable:       false,
                                    fieldLabel:     'Title',
                                    name:           'title',
                                    displayField:   'name',
                                    valueField:     'value',
                                    queryMode: 'local',
                                    store:          Ext.create('Ext.data.Store', {
                                        fields : ['name', 'value'],
                                        data   : [
                                            {name : '图片在前',   value: 'img-first'},
                                            {name : '文字在前',   value: 'font-first'}
                                        ]
                                    })
                                },
                                {
                                   xtype: 'displayfield',
                                   value: '对齐:'
                               },
                                {
                                    width:          80,
                                    xtype:          'combo',
                                    mode:           'local',
                                    value:          '2',
                                    id :            'cb_wm_align',
                                    triggerAction:  'all',
                                    forceSelection: true,
                                    editable:       false,
                                    fieldLabel:     'Title',
                                    name:           'title',
                                    displayField:   'name',
                                    valueField:     'value',
                                    queryMode: 'local',
                                    store:          Ext.create('Ext.data.Store', {
                                        fields : ['name', 'value'],
                                        data   : [
                                            {name : '上对齐',   value: '0'},
                                            {name : '中对齐',   value: '1'},
                                            {name : '下对齐',   value: '2'}
                                        ]
                                    })
                                },
                                {
                                   xtype: 'displayfield',
                                   value: '间距:'
                               },
                               {
                                   id : 'font-img-space',
                                   xtype: 'numberfield',
                                   width: 60,
                                   value: 10,
                                   minValue: 1,
                                   maxValue: 1000,
                                   allowBlank: false
                               },
                               {
                                   xtype: 'displayfield',
                                   value: 'px'
                               }
                            ]
                       },
                       {
                            xtype : 'fieldcontainer',
                            combineErrors: true,
                            msgTarget: 'side',
                            fieldLabel: '字体类型',
                            value: 70,
                            //hidden: true,
                            id : 'font-size-con',
                            labelWidth: 70,
                            anchor: '100%',
                            layout: {
                                type: 'hbox',
                                defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                            },
                            defaults: {
                                hideLabel: true
                            },
                            items : [
                                {
                                    width:          100,
                                    xtype:          'combo',
                                    mode:           'local',
                                    value:          'wqy-zenhei',
                                    id :            'combox_fonttype',
                                    triggerAction:  'all',
                                    forceSelection: true,
                                    editable:       false,
                                    fieldLabel:     'Title',
                                    name:           'title',
                                    displayField:   'name',
                                    valueField:     'value',
                                    queryMode: 'local',
                                    store:          Ext.create('Ext.data.Store', {
                                        fields : ['name', 'value'],
                                        data   : [
                                            {name : '文泉驿正黑', value: 'wqy-zenhei'},
                                            {name : '文泉微米黑', value: 'wqy-microhei'},
                                            {name : '方正书宋',   value: 'fangzhengshusong'},
                                            //{name : '微软雅黑',   value: 'yahei'},
                                            {name : '方正楷体',   value: 'fangzhengkaiti'},
                                            {name : '方正黑体',   value: 'fangzhengheiti'},
                                            {name : '方正仿宋',   value: 'fangzhengfangsong'},
                                            {name : 'DroidSansFallback',   value: 'droidsansfallback'}
                                        ]
                                    })
                                },
                               {
                                   xtype: 'displayfield',
                                   value: '大小:   '
                               },
                               {
                                   name : 'font_size',
                                   xtype: 'numberfield',
                                   id : 'font_size',
                                   width: 50,
                                   minValue: 1,
                                   maxValue: 1000,
                                   value: 30,
                                   
                                   allowBlank: false
                               },
                               {
                                   xtype: 'displayfield',
                                   value: '颜色:   '
                               },
                                {
                                    xtype: 'textfield',
                                    width: 65,
                                    id :'font_color',
                                    value: '#FFFFFF',
                                    name : 'firstName'
                                },
                                {
                                    xtype : colorField,
                                    width: 30, 
                                    height: 50
                                }
                            ]
                       },
                    {
                        xtype: 'fieldcontainer',
                        fieldLabel: '文字阴影',
                        //hidden: true,
                        id:'font-shadown-con',
                        combineErrors: false,
                        //hidden: true,
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        defaults: {
                            hideLabel: true
                        },
                        items: [
                           {
                                xtype : 'checkbox',
                                labelWidth:     70,
                                fieldLabel: '增加阴影',
                                id: 'cb_wm_shadown',
                                listeners :{
                                    'change': function (checkbox, isChecked) 
                                    {
                                        if (isChecked == true)
                                        {
                                            Ext.getCmp('font_shadown').setDisabled(false)
                                            Ext.getCmp('shadown_display').setDisabled(false)
                                        }
                                        else
                                        {
                                            Ext.getCmp('font_shadown').setDisabled(true)
                                            Ext.getCmp('shadown_display').setDisabled(true)
                                        }
                                    }
                                }
                           }
                           ,
                           {
                               xtype: 'displayfield',
                               id : 'shadown_display',
                               disabled : true,
                               value: '阴影透明度：'
                           },
                           {
                                xtype: 'sliderfield',
                                width: 205,
                                value: 90,
                                minValue: 1,
                                maxValue: 100,
                                disabled : true,
                                id : 'font_shadown',
                                name: 'font_shadown',
                                listeners :{
                                    'change':function(){
                                        Ext.getCmp('text_font_shadown').setValue(Ext.getCmp('font_shadown').getValue())
                                    }
                                }
                           }
                           ,
                           {
                                xtype:"textfield",
                                id: 'text_font_shadown',
                                disabled : true,
                                width: 35,
                                height: 20,
                                value: '90'
                           }
                        ]
                    },
                    {
                        xtype: 'fieldcontainer',
                        fieldLabel: '水印透明',
                        //hidden: true,
                        id:'transparent-con',
                        combineErrors: false,
                        //hidden: true,
                        defaults: {
                            //hideLabel: true
                        },
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        defaults: {
                            hideLabel: true
                        },
                        items: [
                           {
                                xtype: 'sliderfield',
                                width: 310,
                                value: 90,
                                minValue: 1,
                                maxValue: 100,
                                id : 'transparent',
                                name: 'transparent',
                                listeners :{
                                    'change':function(){
                                        Ext.getCmp('text_transparent').setValue(Ext.getCmp('transparent').getValue())
                                    }
                                }
                           }
                           ,
                           {
                                xtype:"textfield",
                                id: 'text_transparent',
                                disabled : true,
                                width: 35,
                                height: 20,
                                value: '90'
                           }
                        ]
                    },
                   {
                        xtype : 'fieldcontainer',
                        combineErrors: true,
                        msgTarget: 'side',
                        //fieldLabel: '字体类型',
                        //value: 70,
                        //hidden: true,
                        id : 'fc-wm-pos',
                        //labelWidth: 70,
                        anchor: '100%',
                        layout: {
                            type: 'hbox',
                            defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                        },
                        defaults: {
                            //hideLabel: true
                        },
                        items : [
                        {
                            xtype: 'radiogroup',
                            fieldLabel: '水印位置',
                            labelWidth: 70,
                            //cls: 'x-check-group-alt',
                            //hidden: true,
                            columns: [50, 50, 50],
                            id : 'wm-pos',
                            width : 250,
                            //layout: 'anchor',
                            //anchor: '100%',
                            //labelStyle: 'padding-left:4px;',
                            vertical: true,
                            items: [
                                {boxLabel: '左上', name: 'rb-custwidth', id:'leftup',  inputValue: 'leftup'},
                                {boxLabel: '左中', name: 'rb-custwidth', id:'left', inputValue: 'left'},
                                {boxLabel: '左下', name: 'rb-custwidth', id:'leftdown', inputValue: 'leftdown'},
                                {boxLabel: '中上', name: 'rb-custwidth', id:'up', inputValue: 'up'},
                                {boxLabel: '中部', name: 'rb-custwidth', id:'center', inputValue: 'center'},
                                {boxLabel: '中下', name: 'rb-custwidth', id:'down', inputValue: 'down'},
                                {boxLabel: '右上', name: 'rb-custwidth', id:'rightup', inputValue: 'rightup'},
                                {boxLabel: '右中', name: 'rb-custwidth', id:'right', inputValue: 'rightcenter'},
                                {boxLabel: '右下', name: 'rb-custwidth', id:'rightdown', inputValue: 'rightdown', checked:true}
                            ]
                            ,
                            listeners :{
                                'change':function(){
                                    if (Ext.getCmp("leftup").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(true)
                                        Ext.getCmp('h_margins-container').setVisible(true)
                                        Ext.getCmp('fc_wm_offset').setVisible(false)
                                    }
                                    else if (Ext.getCmp("left").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(false)
                                        Ext.getCmp('h_margins-container').setVisible(true)
                                        Ext.getCmp('fc_wm_offset').setVisible(true)
                                    }
                                    else if (Ext.getCmp("leftdown").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(true)
                                        Ext.getCmp('h_margins-container').setVisible(true)
                                        Ext.getCmp('fc_wm_offset').setVisible(false)
                                    }
                                    else if (Ext.getCmp("up").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(true)
                                        Ext.getCmp('h_margins-container').setVisible(false)
                                        Ext.getCmp('fc_wm_offset').setVisible(false)
                                    }
                                    else if (Ext.getCmp("center").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(false)
                                        Ext.getCmp('h_margins-container').setVisible(false)
                                        Ext.getCmp('fc_wm_offset').setVisible(true)
                                    }
                                    else if (Ext.getCmp("down").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(true)
                                        Ext.getCmp('h_margins-container').setVisible(false)
                                        Ext.getCmp('fc_wm_offset').setVisible(false)
                                    }
                                    else if (Ext.getCmp("rightup").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(true)
                                        Ext.getCmp('h_margins-container').setVisible(true)
                                        Ext.getCmp('fc_wm_offset').setVisible(false)
                                    }
                                    else if (Ext.getCmp("right").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(false)
                                        Ext.getCmp('h_margins-container').setVisible(true)
                                        Ext.getCmp('fc_wm_offset').setVisible(true)
                                    }
                                    else if (Ext.getCmp("rightdown").getValue() == true)
                                    {
                                        Ext.getCmp('v_margins-container').setVisible(true)
                                        Ext.getCmp('h_margins-container').setVisible(true)
                                        Ext.getCmp('fc_wm_offset').setVisible(false)
                                    }
                               }
                            }
                        },
                        {
                            xtype: 'fieldcontainer',
                            fieldLabel: '',
                            combineErrors: false,
                            anchor: '100%',
                            items: [
                            {   
                                xtype: 'fieldcontainer',
                                fieldLabel: '垂直边距',
                                //hidden: true,
                                id: 'v_margins-container',
                                combineErrors: false,
                                defaults: {
                                    hideLabel: true
                                },
                                labelWidth: 90,
                                anchor: '100%',
                                layout: {
                                    type: 'hbox',
                                    defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                                },
                                items: [
                                   {
                                       name : 'v_margins',
                                       xtype: 'numberfield',
                                       id : 'v_margins',
                                       width: 60,
                                       value: 10,
                                       maxValue: 1000,  
                                       minValue: 0,
                                       allowBlank: false
                                   },
                                   {
                                       xtype: 'displayfield',
                                       value: 'px'
                                   }
                                ]
                            },
                            {
                                xtype: 'fieldcontainer',
                                fieldLabel: '水平边距',
                                //hidden: true,
                                combineErrors: false,
                                id: 'h_margins-container',
                                defaults: {
                                    hideLabel: true
                                },
                                //labelWidth: 60,
                                labelWidth: 90,
                                anchor: '100%',
                                layout: {
                                    type: 'hbox',
                                    defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                                },
                                items: [
                                   {
                                       name : 'h_margins',
                                       id : 'h_margins',
                                       xtype: 'numberfield',
                                       width: 60,
                                       maxValue: 1000,  
                                       minValue: 0,
                                       value: 10,
                                       allowBlank: false
                                   },
                                   {
                                       xtype: 'displayfield',
                                       value: 'px'
                                   }
                                ]
                            }
                            ,
                            {
                                xtype: 'fieldcontainer',
                                fieldLabel: '中线垂直偏移',
                                hidden: true,
                                combineErrors: false,
                                id: 'fc_wm_offset',
                                defaults: {
                                    hideLabel: true
                                },
                                labelWidth: 90,
                                anchor: '100%',
                                layout: {
                                    type: 'hbox',
                                    defaultMargins: {top: 0, right: 5, bottom: 0, left: 0}
                                },
                                items: [
                                   {
                                       id : 'h_wm_offset',
                                       xtype: 'numberfield',
                                       width: 60,
                                       maxValue: 1000,  
                                       minValue: -1000,
                                       value: 0,
                                       allowBlank: false
                                   },
                                   {
                                       xtype: 'displayfield',
                                       value: 'px'
                                   }
                                ]
                            }
                            ]
                        }
                        ]
                   }
                ]
            }
            ,
            {
                xtype: 'box', //或者xtype: 'component',  
                name: 'picbox',
                id: 'picbox',
                //width: 500, 
                //height: 500,
                autoEl: {  
                }
            }

           ]},
           {
                columnWidth:.5,
                xtype: 'fieldcontainer',
                fieldLabel: '',
                combineErrors: false,
                //items:[]
               items: [{
                    xtype:"textarea",
                    fieldLabel: '',
                    name: 'show_url',
                    id: 'show_url',
                    width: 470,
                    height: 45,
                    cols: 2,
                    lableWidth:50, 
                    value: '',
                    allowBlank:false
               },
               { 
                    xtype:'panel', 
                    width: 470, 
                    height: 560,
                    id: 'picbox1',
                    name: 'picbox1',
                    //bodyStyle: "background-color:#dfe8f6; border-width: 0px 2px 0px 0px;",
                    bodyStyle: "background:transparent;",
                    html:'' 
               }
               ]
           }]}
           ],
           buttons:[
           {
               text:'<font color="red">使用说明</font>',
               listeners:{ 
                   "click":function() 
                   { 
                       read_window.show()
                   } 
               }
           },
           {
               text:"显示原图", 
               listeners:{ 
                   "click":function() 
                   { 
                       var url = get_service_url()
                       if (url != 0) 
                       {
                           var img_url = '<img src=\"' + url + '\"/>'
                           Ext.getCmp('picbox1').body.update(img_url)
                           Ext.getCmp('show_url').setValue(url)
                       }
                   } 
               }
           },
           {
               text:'<font color="yellow">生成效果图</font>',
               listeners:{ 
                   "click":function() 
                   {
                      if (g_update_url == '')
                      {
                          result = check_update();
                          if (result == '')
                          {
                            Ext.MessageBox.alert('OSS图片服务', '当前版本是最新版本!');
                          }
                          else
                          {
                            var msg = '有新版本，新版本地址是:' + g_update_url;
                            Ext.MessageBox.alert('OSS图片服务', msg);
                          }
                      }
                      else if (g_update_url != 'ok')
                      {
                        var msg = '有新版本，新版本地址是:' + g_update_url;
                        Ext.MessageBox.alert('OSS图片服务', msg);
                      }
                      show_result()
                   }
               }
           },
           {
               text: "在浏览器打开", 
               //hidden: true,
               listeners:{ 
                   "click":function() 
                   { 
                       var url = get_result_url()
                       if (url != -1)
                       {
                           var host = get_host()
                           if (host != 0) 
                           {
                               url = host + url
                               window.open(url, 'OSS图片服务', 'width=800, height=600, menubar=no, toolbar=no, scrollbars=yes');
                           }
                       }
                   } 
               }
           },
           {
               text: "帮助", 
               //hidden: true,
               listeners:{ 
                   "click":function() 
                   { 
                      help_window.show()
                   } 
               }
           },
           {
               text: "试用", 
               //hidden: true,
               listeners:{ 
                   "click":function() 
                   { 
                      Ext.getCmp('image_wm_url').setValue('panda.png')
                      Ext.getCmp('bucket').setValue('img.oss-demo.com')
                      Ext.getCmp('object').setValue('example.jpg')
                      Ext.getCmp('image_font_url').setValue('Hello 图片服务!')
                      Ext.MessageBox.alert('OSS图片服务', '设置试用域名成功!');
                   } 
               }
           },
           {
               text: "更新", 
               //hidden: true,
               listeners:{ 
                   "click":function() 
                   { 
                      result = check_update();
                      if (result == '')
                      {
                        Ext.MessageBox.alert('OSS图片服务', '当前版本是最新版本!');
                      }
                      else
                      {
                        var msg = '有新版本，新版本地址是:' + result;
                        Ext.MessageBox.alert('OSS图片服务', msg);
                      }
                   } 
               }
           },
           {
               text: "管理", 
               cls: 'floater',
               id : 'bt_manager',
               enableToggle: true,
               menu: 
               [
                    {
                        text:'ID/Key设置',
                        handler: function () {
                            set_id_key()
                        }
                    },
                    {
                        text:'样式管理',
                        handler: function () {
                            if (check_basic_info() == 1)
                            {
                                list_style()
                            }
                        }
                    },
                    {
                        text:'将操作保存成样式',
                        handler: function () {
                            if (check_basic_info() == 1)
                            {
                                Ext.MessageBox.prompt('OSS图片服务', '样式名称规范:<br/> 1.长度为1-63个字符. <br/> 2.可以包含数字、大小写字母、下划线(_)、<br/>&nbsp;&nbsp;&nbsp;中划线(-)以及小数点(.)<br/> 3.如果样式自定义分隔符有下划线(_) 或者<br/>&nbsp;&nbsp;&nbsp;中划线(-) 样式名称最好不要包含上述两<br/>&nbsp;&nbsp;&nbsp;个字符，可能会导致解析异常i<br/><br/>请输入样式名称:', put_style_show_result);
                            }

                        }
                    },
                    {
                        text:'新增自定义样式',
                        handler: function () {
                            if (check_basic_info() == 1)
                            {
                                add_style()
                            }
                        }
                    },
                    {
                        text:'频道属性设置',
                        handler: function () {
                            if (check_basic_info() == 1)
                            {
                                get_channel()
                            }
                        }
                    }
                    /*
                    ,
                    {
                        text:'样式管理',
                        handler: function () {
                            style_window.show()
                        }
                    }
                    */
               ]
           }
           ]
       }) 
       _window.show(); 
       //help_window.show()
   });
   </script>
   </head>

   <body>
       <div id='mainPanel'></div>
   </body>
</html>
